VsCode + node+ vue.js 开发环境搭建(一)
1.安装最新的 vscode ,这个很容易安装。安装完以后 CTRL+SHIFT+X用来安装 中文语言包环境,安装完语言包后,修改设置 安装后,在 locale.json 中添加 "locale": "zh-cn",即可载入中文(简体)语言包。要修改 locale.json,你可以同时按下 Ctrl+Shift+P 打开命令面板,之后输入 "c
1.安装最新的 vscode ,这个很容易安装。安装完以后 CTRL+SHIFT+X用来安装 中文语言包环境,安装完语言包后,修改设置
安装后,在 locale.json
中添加 "locale": "zh-cn"
,即可载入中文(简体)语言包。要修改 locale.json
,你可以同时按下 Ctrl+Shift+P
打开命令面板,之后输入 "config" 筛选可用命令列表,最后选择配置语言命令。请参阅文档并获取更多信息。"locale":"zh-cn" // 修改完后重新启动
2.要在机器上开发 vue.js 有两种模式,一种直接用 .js ,这种方式不用 安装.node 环境,另一种用 webpack,
3.在机器安装 node node-v10.8.0-x64.msi,在安装过程中可能会出现权限问题, 这样安装:
+以管理员的方式启动 CMD
+用命令:msiexec /package node-v10.8.0-x64.msi 方式来安装后,不会有 2053,2052错误。
4. 项目运行方式。
4.1 npm install vue-cli -g 安装 vue-cli 这个工具。
安装了这个工具以后,就可以在目录中运行
cd 目录路径(项目路径)
vue init webpack-simple first-vue 用来初始化一个项目
注意这里不能用 -simple 如果用simple builder 与 config 目录则没有。
npm install 再运行 这个命令 构造项目,得到需要的包
可以用 npm run dev 来测下这个构造是否成功。
4.2下载一个 vue.项目 在 目录中执行:
$ npm install //用来重新得到本项目中用得到的 node .包
$ npm run dev //用来执行项目运行。
5.在vscode 中直接 打开 调试工具,看能不能运行, 可以运行表示,已经安装好,这时弹出的窗口为系统默认的浏览器。IE
6.修改dev-server.js 这个文件 让 node 运行时,可以直接打开chrome
opn(uri) 修改为
opn(uri,{ app: ['chrome', '--incognito'] })
这样在VSCODE 与 NODE的开发环境,就建立好了。
上面第6点过时了,在vue的官网上找到一个办法启动:
1. 用 在控制台 进入项目页 用 npm run dev 启动 node的这个项目
打开 config/index.js
并找到 devtool
属性。将其更新为:
|
把下面一段加到launch.json里面
{
"version": "0.2.0",
"configurations": [
{
"type": "chrome",
"request": "launch",
"name": "vuejs: chrome",
"url": "http://localhost:8080",
"webRoot": "${workspaceFolder}/src",
"breakOnLoad": true,
"sourceMapPathOverrides": {
"webpack:///src/*": "${webRoot}/*"
}
}
]
}
https://cn.vuejs.org/v2/cookbook/using-axios-to-consume-apis.html 这里找到的方法
更多推荐
所有评论(0)