webpack前端神器 / 网络研习社#16

https://webpack.js.org

但凡能称为神器的，都是有两把刷子的。vue是js的前端框架，要设计一个完整的网页，它要安装大量的依赖，就像我前面几篇所介绍的，要安装vue-router, vue-loader, vue-resource等等，还要配置各项设置。当我一边啃书本，一边看教学视频时，也不由一阵头大：这到底是啥神器嘛，咋要这么多配置啊，这不整死人嘛！

可当我动手实践时，才发现，这些其实都是些基础知识，你完全可以不用理会，这些webpack在第一次创建时都会帮你配置，你只要开始你的核心业务就好啦！

webpack五分钟安装版：

#前提是你已经安装了node.js。
1. npm install -g cnpm --registry=https://registry.npm.taobao.org   
   //注册为国内淘宝镜像，使用cnpm代替npm，这会加快你的安装速度！
2. cnpm install --global vue
   //全局安装
3. cnpm install --global vue-cli
4. cnpm install webpack –g  
   //全局安装
5. vue init webpack webpackdemo  
   //初始化一个项目webpackdemo  
  //在选项中取消最后一项默认的 npm install ,我们用 cnpm install
6. cd webpackdemo
7. cnpm install            
8. cnpm run dev

到此，就可以愉快地运行了！如果不是实践一下，还在看着过期的教程和方法，有时候软件更新太快也是一个麻烦事啊。

初始化的项目结构

以上是初始化的项目结构，你不用写一行代码，你的服务就可以运行起来，确实可以当得起神器之名！

网络研习社系列文章：

@lemooljiang #network-institute