webpack入门01

标签：方法   bind   css   sse   webpack   source   中标   node   nal   

1，创建项目目录：

• 创建项目目录为：webpack_demo

2，npm初始化：

• 在项目目录中初始化npm：npm init
• 初始化将在项目目录中生成package.json文件

3，安装webpack：

• 通过npm安装webpack：npm install webpack --save-dev
• 安装成功后webpack会在node_modules中

4，webpack测试（单个JS文件）：

• 在项目目录创建hello.js文件
• 将hello.js打包成hello.bundle.js：webpack hello.js hello.bundle.js
• hash本次打包的哈希值 | Version版本 | Assert本次生成的文件名 | size生成的文件大小 | chunks本次打包的分块 | chunk Names本次打包的块名

5，webpack测试（有依赖关系的JS文件）

• 创建hello.js和world.js，其中hello.js依赖world.js
• 将2个文件打包合并为一个hell.bundle.js文件：webpack hello.js hello.bundle.js

6，webpack测试（有CSS的文件）

• webpack默认只支持js，要管理打包其他类型文件，需要使用加载器，此处要打包css文件，要先安装css文件加载器：
• npm install css-loader --save-dev
• npm install style-loader --save-dev

7，webpack其他命令参数：

webpack入门01

标签：方法   bind   css   sse   webpack   source   中标   node   nal   

原文地址：http://www.cnblogs.com/threeron/p/7520281.html