修改webpack.prod.conf.js ， 增加以下代码 ， 目的是分离框架代码和业务代码
虽然上面步骤抽出框架代码生成两个文件 ， 但是app.js还是包含框架代码
cacheGroups对象 ， 定义了需要被抽离的模块
其中test属性是比较关键的一个值 ， 他可以是一个字符串 ， 也可以是正则表达式 ， 还可以是函数 。如果定义的是字符串 ， 会匹配入口模块名称 ， 会从其他模块中把包含这个模块的抽离出来
name是抽离后生成的名字 ， 和入口文件模块名称相同 ， 这样抽离出来的新生成的framework模块会覆盖被抽离的framework模块
整合 webpack-dev-server
开发环境开启服务监听文件改动实时更新最新内容
在build中添加webpack.dev.conf.js文件
在package.json scripts属性添加内容
npm run dev
自动打开浏览器打开入口页面实时更新
独立导出 css 文件
安装css相关依赖
sass less 预处理
webpack.base.conf.js 文件修改
图片和路径处理
webpack.base.conf.js 文件修改
build 时报错
webpack4.0中使用“extract-text-webpack-plugin”报错
解决办法
背景图片路径问题
由于css文件分离出来的原因 ， 会导致在css文件夹下找images文件夹下的图片
解决办法 publicPath属性改为 '/' ， 以绝对路径的方式寻找资源
【基于webpack4.X从零搭建React脚手架的方法步骤】
推荐阅读
- 如何随心所欲制作小i的动画图片
- 诺基亚3152手机的数据同步
- 现代是从什么时候开始的
- 国内服装面料都从哪里采购
- 怎样在桌面上创建IE图标?2种创建IE图标方法分享
- 青城山前山索道是从哪里到哪里
- 晚风中吹过几帧从前啊什么歌
- 显卡的种类有哪些
- 日本历代天皇
- 为什么Android系统手机没有IE浏览器？安卓手机浏览器是基于什么内核？