下载 vscode: https://code.visualstudio.com/
下载nodejs: https://nodejs.org/en/
cmd 中 node -v 测试是否安装成功
cmd 中 npm prefix -g 查看全局下载模块保存目录
npm set prefix -g + {自定义新目录} (我这里是D:\Programs\nodejs\node_global)
安装 cnpm
npm install -g cnpm --registry=https://registry.npm.taobao.org
将cnpm的安装目录D:\Programs\nodejs\node_global\node_modules加入path(cmd调用cnpm时系统查找cnpm的路径)
新建NODE_PATH环境变量,将D:\Programs\nodejs\node_global\node_modules加入。
cmd 进入 node 然后 输入 module.paths查看上述目录是否成功加入。
cmd cnpm install -g vue-cli 下载vue-cli
新建文件夹vuelearn
打开cmd 进入vuelearn目录 运行 vue init webpack myproject(
vue init 模板类型 项目名称;
模板类型有很多种;使用vue list查看
)
cd myproject
npm install
npm run dev
到这里简单的vue项目目录就搭建完成。
VScode配置
下载各种必要的extension是 比如中文 , vuetur
下载快捷键文档
设置字体
然后重点讲设置editor的背景颜色为豆沙绿的护眼色,使用vs light color theme
进入安装目录下的\resources\app\extensions\theme-defaults\themes 文件夹
打开light_vs.json文件,在tokencolors下 添加新的键值对如下。
"colors": {
// Editor
"editor.background": "#C7EDCC" //护眼色豆沙绿
}
重启vscode 发现editor背景色变为豆沙绿。