webpack+vue开发环境搭建
前提:
1.安装必要工具(node等);
2.安装全局vue-cli脚手架(快速搭建vue开发模板)
命令:npm install -g vue-cli
3.安装webpack
命令:npm install webpack -g (有问题可以使用npm install --save-dev webpack-cli -g命令)
4.运行命令: vue init webpack 项目名
注:回车后可能显示
Command vue init requires a global addon to be installed. Please run npm install -g @vue/cli-init and try again.
解决方法:
npm install -g @vue/cli-init
注:webpack优势
对 CommonJS 、AMD 、ES6的语法做了兼容；
对js、css、图片等资源文件都支持打包；
串联式模块加载器以及插件机制,让其具有更好的灵活性和扩展性，例如提供对CoffeeScript、ES6的支持；
有独立的配置文件webpack.config.js；
可以将代码切割成不同的chunk，实现按需加载，降低了初始化时间；
支持 SourceUrls 和 SourceMaps，易于调试；
具有强大的Plugin接口，大多是内部插件，使用起来比较灵活；
webpack 使用异步 IO 并具有多级缓存，使得 webpack 很快且在增量编译上更加快。
注:vue构建项目常见填写信息
Project Name：要创建的项目名称；
Project Description：项目简介，也会出现在package.json文件中，可选;
Author：作者，可选；
Install vue-router：是否安装vue路由组件；
Use ESLint to lint your code：是否需要使用ESLint模块进行代码检测；
Setup unit tests with Karma + Mocha：是否需要安装测试(单元测试)；
Setup e2e tests with Nightwatch？：是否安装段到端的测试
5.根据README.md中运行命令运行项目