vue,angular4,react 之webpack搭建
前端三大框架基础项目
- webpack3 + typescript+react
https://github.com/githbq/hbq-typescript-react-boilerplate.git
- webpack3 + babel(es6+) + react
https://github.com/githbq/hbq-simple-webpack2-react.git
- webpack3 + typescript+vue2
https://github.com/githbq/hbq-typescript-vue-boilerplate.git
- webpack3 + typescript+angular4
https://github.com/githbq/hbq-angular-boilerplate.git
特点
1. 支持多入口页面自动生成
- 在
src/apps/ 目录下会创建 .ts 或者 react 下 .tsx 会自动生成 .html 文件
- 自定义html模板:
src/apps 下创建与 tsx? 同名的 [name].html ,[name].pug
- 优先使用自定义模板,否则使用
dev-config/index.template.pug 作为 htmlWebpackPlugin 模板
2. 同时支持ejs 与 pug 作为 htmlWebpackPlugin 模板
3. 同时支持 stylus 与 less 编写样式
4. 自动构建目录在 dev-config 目录下,配置文件完全解耦
├── dev-config
| ├── configs
| | ├── alias.js
| | ├── constants.js
| | ├── devServer.js
| | ├── entry.js
| | ├── globalConfig.js
| | ├── plugins.html.js
| | ├── plugins.js
| | ├── proxy.js
| | ├── rules.css.js
| | ├── rules.js
| | └── utils.js
| ├── index.template.html
| ├── index.template.pug
| ├── lite-server-config.js
| ├── readme.md
| ├── templateCompilers
| | └── pug.js
| └── webpack.config.js
5. hmr(hot module replace) 代码修改热更新支持
安装
1. 直接 git clone 对应的git仓库地址
2. 采用 iclone-cli 脚手架
npm i -g iclone-cli
// then
iclone init -t [模板名称] -n [工程名称]
环境要求
nodejs v8.4
win nodejs v8.4 百度云盘下载链接 http://pan.baidu.com/s/1bpD78YF mac 系统直接使用 n latest 获取最新版本即可
开发工具安利
VSCODE : 这真的很快很好用
win vscode 最新版 x64-1.16.0 百度云盘下载链接 http://pan.baidu.com/s/1bpB5FEf
本人其它模板项目
- koa2 + typescript + mongodb
https://github.com/githbq/hbq-koa2-base.git
https://github.com/githbq/hbq-module-cli-boilerplate.git
TODO
-
README.md 文档还没有写好,挨个写清楚
- 前端单元测试待加入
- 编写
typescript 开发相关文档
欢迎大家提意见! (编辑:李大同)
【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!
|