博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
构建Vue开发环境
阅读量:5339 次
发布时间:2019-06-15

本文共 772 字,大约阅读时间需要 2 分钟。

1.开发环境的准备工作

  • IDE
    可以选择WebStom或者VisualStudio Code
  • Node.js的安装
    node + npm
  • 调试环境
    Google Chrome + Vue.js

2.什么是nvm

nvm:Node Version Manager,作为前端node依赖包管理工具,可以更好的管理Node的版本

3.nvm的安装

786645-20190122144825512-266053412.png

选择上面的进行下载,将下载的文件进行解压:nvm-setup.exe,单击开始安装,直接点击下一步就可以。

4.测试nvm版本安装是否成功

nvm --version

5.查看本地安装的node版本

nvm list

786645-20190122145424404-1088533156.png

6.使用命令查看远程服务器node版本

nvm ls-remote

7.使用命令下载最新版本

nvm install v11.7.0

8.使用命令使用node版本(切换)

nvm use v11.7.0

9.淘宝npm镜像

npm install -g cnpm --registry=https://registry.npm.taobao.org

完成上命令,即可使用cnpm

10.chrome浏览器安装vue调试器vue-devtools

下载vue-devtools完成后打开命令行cmd进入vue-devtools文件夹,输入命令:

cnpm install

786645-20190122150125950-667152110.png

编译通过以后输入以下命令:

cnpm run build

786645-20190122150458328-1881198316.png

找到shells\chrome文件夹下面的manifest.json文件,把persistent改为true

786645-20190122150629158-672263175.png
786645-20190122150743438-1031003953.png

打开谷歌浏览器,开启开发者模式,找到【更多工具-扩展工具】,加载已解压的扩展程序,找到目录下shell/chrome,确定即可

786645-20190122151811960-514656817.png

转载于:https://www.cnblogs.com/ButterflyEffect/p/10304046.html

你可能感兴趣的文章
【算法•日更•第三十二期】教你用出windows体验的Linux
查看>>
[BZOJ2938] 病毒
查看>>
webstorm修改文件,webpack-dev-server不会自动编译刷新
查看>>
[NOIP2009] 靶形数独
查看>>
【Python网络编程】利用Python进行TCP、UDP套接字编程
查看>>
在百度和博客园发表地文章被爬索的速度比较
查看>>
Scikit-learn 库的使用
查看>>
CSS: caption-side 属性
查看>>
python 用数组实现队列
查看>>
认证和授权(Authentication和Authorization)
查看>>
Mac上安装Tomcat
查看>>
CSS3中box-sizing的理解
查看>>
传统企业-全渠道营销解决方案-1
查看>>
Lucene全文检索
查看>>
awk工具-解析1
查看>>
推荐一款可以直接下载浏览器sources资源的Chrome插件
查看>>
CRM product UI里assignment block的显示隐藏逻辑
查看>>
算法笔记_070:BellmanFord算法简单介绍(Java)
查看>>
tp5--数据库查询的常用操作
查看>>
hao643.com劫持(IE和Chrome等被修改快捷方式跳转到hao123.com)
查看>>