vue-vscode编辑器

用vscode来开发vue项目

1.先去官网下个vscode,安装完成后再弄个中文包 - - !英语不太好
vue-vscode编辑器
2.安装node.js:javascript运行环境(runtime),不同系统直接运行各种编程语言
node.js官网下载安装,配置下path环境变量vue-vscode编辑器

3.安装npm包管理器,国内使用npm会很慢,这里推荐使用淘宝NPM镜像(http://npm.taobao.org/)
$ npm install -g cnpm –registry=https://registry.npm.taobao.org
vue-vscode编辑器
4.webpack: 它主要的用途是通过 CommonJS 的语法把所有浏览器端需要发布的静态资源做相应的准备,比如资源的合并和打包。vue-vscode编辑器
5.vue-cli:脚手架构建工具
npm install -g vue-cli

6.创建一个基于"webpack"模板的新项目,名称为test
$ vue init webpack test
接下来就是一大串配置vue-vscode编辑器
vue-vscode编辑器
7.npm run dev 跑起项目,本地打开就可以预览了
vue-vscode编辑器

补充一点

vscode下的vue文件,没有智能提示补全,所以先安装个vue-vscode编辑器
然后在设置里面的settings.json下添加这一段

    "files.associations": {
        "*.vue" : "html"
    }

vue-vscode编辑器
然后我们就可以看到这个补全提示了
vue-vscode编辑器