React开发环境搭建

1 查看上一篇文章,并按照步骤来

2 自动打包(有需要再添加)

webpack.config.js  添加 watch:true

3 npm安装react相关

--save-dev  react

      react-dom

--save  babel-preset-react 

设置 webpack.config.js  ==>  query: {presets: ['es2015','react']}

4 demo文件

入口:a.js

1
2
3
4
5
6
7
import React from "react";
import ReactDOM from "react-dom";
import Hello from "./hello";
ReactDOM.render(
  <Hello />,
  document.querySelector('#app')
);

引用:hello.js

1
2
3
4
5
6
7
8
9
10
11
import React from "react";
class Hello extends React.Component{
  render() {
    return (
      <div>
          Hello, World!
      </div>
    )
  }
}
export default Hello;

5 编译,运行

webpack编译下,webpack-dev-server服务器,打开 http://127.0.0.1:8080/dist/

ok!

posted @   HHLweb  阅读(130)  评论(0编辑  收藏  举报
编辑推荐:
· 现代计算机视觉入门之:什么是图片特征编码
· .NET 9 new features-C#13新的锁类型和语义
· Linux系统下SQL Server数据库镜像配置全流程详解
· 现代计算机视觉入门之:什么是视频
· 你所不知道的 C/C++ 宏知识
阅读排行:
· 不到万不得已,千万不要去外包
· C# WebAPI 插件热插拔(持续更新中)
· 会议真的有必要吗?我们产品开发9年了,但从来没开过会
· 【译】我们最喜欢的2024年的 Visual Studio 新功能
· 如何打造一个高并发系统?
点击右上角即可分享
微信分享提示