关于webpack遇到的一些问题
1.热替换,添加HMR功能,可以实现无刷新替换
npm install babel-preser-react-hmre --save-dev
然后配置下.babelrc
{ "presets": [ "es2015","react"], /* if you want to use babel runtime, uncomment the following line */ // "plugins": ["transform-runtime"], "env": { "development": { "presets": ["react-hmre"] } } }
2.关于sass
sass除了安装sass,sass-loader,还有安装node sass
npm install --save-dev node-sass
loader如果无需分类打包,webpack配置
{ test:/\.(scss|sass)$/,include: path.resolve(__dirname, 'app'),loader:'style-loader!css-loader!sass-loader'}
3.webpack不能通过ipv4访问
具体见写的另外的文章
4.关于webpack图片打包的问题
1.在react组件中引用,也就是说在html中引用
<img src={require('../../images/test2.png')} alt=""/>
2、在css里的图片引用:
background: url("images/test3.png") 0 0 no-repeat;
webpack配置图片打包:
{ test: /\.(png|jpg)$/,include: path.resolve(__dirname, 'app'),loader: 'url-loader?name=images/[hash:8].[name].[ext]'},
还有如果是在css中写背景图片样式最好用相对路径
以上参考不由分说博客