vue开发环境搭建

脚手架搭建

# install vue-cli
$ npm install --global vue-cli
# create a new project using the "webpack" template
$ vue init webpack my-project
# install dependencies and go!
$ cd my-project
$ npm install
$ npm run dev

Paste_Image.png

安装成功后，用vue -V查看版本

新建项目，并初始化：vue init webpack vue_demo

Paste_Image.png

初始化完成
项目名称：vue_demo
项目描述：a demo for vue
作者：。。。
安装vue-router
使用EsLint（语法检查）
不使用单元测试
进入项目目录，查看初始化的项目文件

Paste_Image.png

这时项目还不能运行，需要安装依赖包，项目依赖的第三方库存在"package.json"文件中

Paste_Image.png

进入项目根目录，安装依赖： npm install

Paste_Image.png

安装完成后，项目中会新增一个“node_modules”文件夹，里面存的是项目引用的依赖项。

运行项目

Paste_Image.png

vue开发工具会启动一个server监听本地8080端口，在浏览器中可以访问。

Paste_Image.png