超级好用的react脚手架:集成ant-design,sass,less,stylus,dllplugin,happypack

来源:互联网 发布:句法分析算法 编辑:程序博客网 时间:2024/05/17 01:06

react16+ant-design+sass/less/stylus好用的脚手架工具来啦

这个 react项目模板改编自 Create React App.
集成ant-design(按需加载), 可以让你不关心 webpack 配置, 快速开始.
支持3种css预处理器 scss, less, stylus, 免配置.
对打包速度做了优化,且编译后的代码满足大多数spa的需求.

项目地址:

https://github.com/iceyangcc/react-ant-design-dllplugin-startkit

我将持续优化项目结构和功能, 尽请期待 ~
如果你觉得还不错, 不妨start一下, 你的肯定是我持续更新的动力

项目模板功能和特色

  • react16 react-router4 redux react-redux
  • 支持sass/less/stylues预处理器
  • antd@3.0.0 参见ant-design
  • happypack, dllplugin, commonsChunk打包优化
  • axios 网络支持
  • 引入redux-saga异步处理方案, immutable.js优化
  • 模块热加载, 热替换
  • express服务器预览build之后的代码

注意: 此模板需要 webpack@3.8以上支持

安装和使用 (命令行)

1.克隆项目

git clone https://github.com/iceyangcc/react-ant-design-dllplugin-startkit.gitcd react-ant-design-dllplugin-startkit

2.安装npm包

执行 sudo npm i 或者 sudo yarn(荐)

3.进入开发模式

npm start 或者 yarn start

4.打包编译

npm run prebuild (预编译 vendor)npm run build 或者 yarn build
打包之后会在 build目录下生成打包之后的静态文件

5.预览build之后的代码

npm run prod
此条命令将启动express服务器访问build中的静态资源, 自动打卡端口为3002的页面

6.自定义配置

如果这个模板满足不了你的需求,你可以修改 config目录下的相关webpack配置文件

我的新版博客(gitpages搭建)

博客地址:blog.webfixer.cc

iceyangcc 是一个记录 大前端、iOS、Python、读书笔记、工作笔记、的技术博客,我将持续维护,不定期更新

老版博客(CSDN)

我的CSDN博客 iOS / 前端博客

联系方式

如有任何疑问和建议, 请联系我 iceyangcc@163.com, 谢谢

阅读全文
0 0