1- webpack+babel+react+antd 基础demo,可用于学习构建项目,本项目所用仅为基础的配置,高级拓展可自行开发。
1+ ### webpack+babel+react+antd 基础demo,可用于学习构建项目,本项目所用仅为基础的配置,高级拓展可自行开发。
22
33============================================================================
44
5- 其中包含了:
5+ #### 其中包含了:
66
7- 1 样式加载器css,sass,less
7+ ##### 1 样式加载器css,sass,less
88
9- 2 图片加载器
9+ ##### 2 图片加载器
1010
11- 3 webpack-dev-server本地开发热更新
11+ ##### 3 webpack-dev-server本地开发热更新
1212
13- 4 babel配置:
13+ ##### 4 babel配置:
1414
1515(1)babel:解决不支持语法转义es6转义为es5
1616
@@ -30,9 +30,9 @@ cnpm i --save @babel/runtime
3030
3131============================================================================
3232
33- 5 构建react项目,在以上基础上:
33+ #### 构建react项目,在以上基础上:
3434
35- 1 若要构建react项目:
35+ ##### 1 若要构建react项目:
3636
3737安装@babel/preset-react ,识别编译react
3838
@@ -46,7 +46,7 @@ cnpm i --save react react-dom
4646
4747cnpm i --save-dev @babel/plugin-proposal-class-properties
4848
49- 2 css-module模块化
49+ ##### 2 css-module模块化
5050
5151css-loader配置中增加
5252
@@ -55,29 +55,29 @@ modules:{
5555 localIdentName: '[ name] -[ local] -[ hash:base64:10] '
5656}
5757
58- 3 react路由设置:
58+ ##### 3 react路由设置:
5959
6060cnpm i --save react-router-dom (无需使用react-router)
6161
6262(1)开发环境二级路由刷新页面后无法访问,需要在devServer中配置:
6363
6464historyApiFallback: true, 并且 output中配置:publicPath: '/', 目的使/bundle.js为绝对路径
6565
66- 4 redux设置:
66+ ##### 4 redux设置:
6767
6868cnpm i --save redux react-redux
6969
7070cnpm i --save immutable axios 用户数据处理
7171
72- 5 增加antd样式库
72+ ##### 5 增加antd样式库
7373
7474cnpm i --save antd
7575
7676cnpm i --save-dev babel-plugin-import
7777
7878antd默认为英文,故这里顺便做下语言国际化,支持:中文,英文,繁体(见代码)
7979
80- 6 语言国际化切换
80+ ##### 6 语言国际化切换
8181
8282提到国际化,这里顺便补充下组件react-intl
8383
@@ -89,7 +89,7 @@ cnpm i --save react-intl
8989============================================================================
9090
9191
92- 使用:
92+ #### 使用:
9393
94941 下载包解压,进入目录
9595
0 commit comments