webpack使用过程中的一些细节总结

1.webpack把不同的、相互依赖的静态资源都视作模块，并且打包成我们想要的静态资源。另外可以方便的配置多种预处理器，如babel。

使用webpack，让代码组织更清晰，一个文件就是一个模块。

重要的一个配置文件：package.config.js

配置文件主要分为三大块：

1）entry入口文件：让webpack用来作为项目的入口

2）output出口：让webpack用来存放处理完成的文件

3）module模块：包含处理各种类型文件的模块依赖

2.关于安装项目需要的依赖

如果package.json里已经声明了依赖，那直接npm install就会自动安装所有依赖了。

3.关于安装单个依赖插件的–save-dev或–save的区别

–save是对生产环境所需依赖的声明(开发应用中使用的框架，库),

–save-dev是对开发环境所需依赖的声明(构建工具，测试工具).

正常使用npm install时，会下载dependencies和devDependencies中的模块，当使用npm install –production或者注明NODE_ENV变量值为production时，只会下载dependencies中的模块。

4.package.config.js里的方法

1）var path = require(‘path’);

Node中的Path对象，用于处理目录的对象，提高开发效率。

2）path.resolve([from …], to)

将参数 to 位置的字符解析到一个绝对路径里。

from：源路径，to：被解析到绝对路径的字符串

3）在任何模块文件内部，可以使用__dirname变量获取当前模块文件所在目录的完整绝对路径。

5.当代码更新时自动刷新浏览器，需要webpack-dev-server插件

首先 npm install webpack-dev-server –save-dev

然后在config中配置

然后在package.json中配置运行的命令，npm支持自定义命令