Webpack

npm install webpack@3.8.1 --save-dev 局部下载

尽量全局和局部都安装

webpack 入口文件  出口文件

webpack js/a.js  dist/bundle.js 

需要使用webpack指令 必须需要配置webpack.config.js

webpack会有一个默认的配置文件叫webpack.config.js

指令就是简单的webpack就可以了

添加热加载 改变文件内容 按住保存 就会自动刷新

webpack-dev-serve@2.9.4

webpack是3.8.1这个轻量服务器就得是2.9.4如果webpack是4.0版本这个dev-server就得是3.0版本

全局下载webpack-dev-server  npm install-个webpack-dev-server@2.9.4

在开发环境下下载 npm i --save-devwebpack-dev-server@2.9.4

直接使用webpack-dev-server启动就行

但是这种启动只是启动服务器 ，但是不能自动刷新

另外一种启动 webpack-dev-server --hot --inline

既可以启动服务区

也可以让浏览器自动刷新

配置启动指令

在当前项目下的package.json中将

注意的就是在这个服务器下生成的虚拟bundle.js

这个虚拟js文件由配置文件决定的。但是他是和app.html同目录同级别关系。所以引入关系需要注意

打包css文件

loader：依赖包

css转成js  less转成js

json转成js  png 传成js  而loader 就解决这些问题的

css文件打包到js中 需要css-loder   style -loader

打包  json  文件

打包 img图片

打包js文件

 

转载于:https://www.cnblogs.com/yangjingyang/p/10976273.html