webpack的简单使用

今天简单的说一下webpack的使用。

打开cmd（也可以用别的看个人爱好）

打开你要创建项目的文件夹；

webpack安装：

1.全局安装webpack：$npm install webpack -g    ​（npm超时的可以试试cnpm代替）

2.安装完成后可以使用webpack的命令执行查看一下：$webpack -h （查看帮助目录）

3.建议在项目中安装一份本地webpack：$npm install webpack 

webpack初始化项目：

1.创建一个html的文件index.html，这个就不多说了。

2.创建一个package.json用于保存版本信息：$npm init   //之后就狂敲回车吧

webpack的配置：

在单页面的应用里面项目通常会有一个入口文件，假设是 main.js ,需要通过webpack指明他的位置的。

1.在项目的根目录新建一个webpack.config.js （这是webpack默认配置文件名称）

2.在webpack.config.js里面写入口文件和接口文件：

model.exports={

    ​entry : './main.js' //入口文件设置

    ​output:：{

    ​path : '_dirname' //输出文件的保存路径

    ​filename： 'bundle.js' //输出文件名称

    ​    ​    ​    ​    ​}

};

3.在index.html文件中引用bundle.js

<script src="./bundle.js"></script>

 

好啦，就说到这里吧，祝大家早日脱坑！