1.开发环境的准备工作

  • IDE

    可以选择WebStom或者VisualStudio Code
  • Node.js的安装

    node + npm
  • 调试环境

    Google Chrome + Vue.js

2.什么是nvm

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

3.nvm的安装

nvm windows 下载地址

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

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

nvm --version

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

nvm list

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



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

cnpm run build

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



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

构建Vue开发环境的更多相关文章

  1. vue第七单元(vue的单文件组件形式-单文件组件的加载原理-vue-cli构建的开发环境以及生命周期)

    第七单元(vue的单文件组件形式-单文件组件的加载原理-vue-cli构建的开发环境以及生命周期) #课程目标 掌握安装 vue-cli 命令行工具的方法,掌握使用命令行在本地搭建开发环境,使用命令行 ...

  2. 【原创】windows下搭建vue开发环境+IIS部署

    [原创]win10下搭建vue开发环境  如果要转发,请注明原作者和原产地,谢谢! 特别说明:下面任何命令都是在windows的命令行工具下进行输入,打开命令行工具的快捷方式如下图:     详细的安 ...

  3. windows下搭建vue开发环境+IIS部署

    原创]win10下搭建vue开发环境  https://www.cnblogs.com/ixxonline/p/6007885.html 特别说明:下面任何命令都是在windows的命令行工具下进行输 ...

  4. express+mysql+vue开发环境搭建

    最近开始做一个实验室资产管理系统,后台使用node.js的Express框架,前端使用vue,数据库使用mysql.在这里开始简单记录一下开发过程和遇到的问题. 今天要说的是express+mysql ...

  5. 面试官:自己搭建过vue开发环境吗?

    开篇 前段时间,看到群里一些小伙伴面试的时候被面试官问到这类题目.平时大家开发vue项目的时候,相信大部分人都是使用 vue-cli脚手架生成的项目架构,然后 npm run install 安装依赖 ...

  6. 1.WIN10下搭建vue开发环境

    WIN10下搭建vue开发环境 详细的安装步骤如下: 一.安装node.js 说明:安装node.js的windows版本后,会自动安装好node以及包管理工具npm,我们后续的安装将依赖npm工具. ...

  7. 从0构建webpack开发环境(一) 一个简单webpack.config.js

    本文基于webpack4.X,使用的包管理工具是yarn 概念相关就不搬运了,直接开始 首先项目初始化 mkdir webpack-demo && cd webpack-demo ya ...

  8. 初探webpack之从零搭建Vue开发环境

    初探webpack之搭建Vue开发环境 平时我们可以用vue-cli很方便地搭建Vue的开发环境,vue-cli确实是个好东西,让我们不需要关心webpack等一些繁杂的配置,然后直接开始写业务代码, ...

  9. 从源代码构建 Go 开发环境

    从源代码构建 Go 开发环境 Go 1.5 之前的版本 安装C 语言开发环境 在Go 1.5 之前的版本(比如 1.3.1.4),都会部分的依赖 C 语言的工具链,所以如果你有C 语言的开发环境,就可 ...

随机推荐

  1. Linux学习7-Linux常用命令(3)

    文件处理命令         命令名称:touch 命令英文原意:touch 命令所在路径:/bin/touch 执行权限:所有用户 功能描述:创建空文件 语法:touch[文件名] 范例: $tou ...

  2. [NodeJs] 用Nodejs+Express搭建web,nodejs路由和Ajax传数据并返回状态,nodejs+mysql通过ajax获取数据并写入数据库

    小编自学Nodejs,看了好多文章发现都不全,而且好多都是一模一样的 当然了,这只是基础的demo,经供参考,但是相信也会有收获 今天的内容是用Nodejs+Express搭建基本的web,然后呢no ...

  3. 网络 IP地址、网段、子网掩码

    IP地址范围,最小:00000000,00000000,00000000,00000000:最大:11111111,11111111,11111111,11111111 即:最小:0.0.0.0 最大 ...

  4. Java中的Number和Math类简单介绍

    Java Number类 一般地,当需要使用数字的时候,我们通常使用内置数据类型,如:byte.int.long.double 等. 实例: int a = 5000; float b = 13.65 ...

  5. JAVA学习笔记及知识积累

    为什么说Java具有跨平台特性? 我们知道计算机只认识1,0两种电平的信号,所有信息或者计算指令最终都编码成16进制的机器码,这些机器码作为程序保存于计算机的内存中,由CPU去单个取指令执行直到程序执 ...

  6. SQL语句大全教程

    创建数据库 CREATE DATABASE DBNAME 删除数据库 DROP DATABASE DBNAME Ø 基本常用查询 --selectselect * from student; --al ...

  7. Linux内存管理(text、rodata、data、bss、stack&heap)

    一.各内存区段的介绍 系统内的程序分为程序段和数据段,具体又可细分为一下几个部分: (1)text段-代码段 text段存放程序代码,运行前就已经确定(编译时确定),通常为只读,可以直接在ROM或Fl ...

  8. Python项目生成requirements.txt的多种方式

    我相信任何软件程序都会有依赖的类库,尤其现在开源如此的火爆,因为一个项目可能会有无很多的依赖的包 这个时候难道我们都要一个一个的去找到安装吗?即使你找到了依赖的包 但是呢模块的版本又有很多难道你都要装 ...

  9. asp.net MVC4 框架揭秘 读书笔记系列3

    IIS/ASP.net管道 本节全部用图形表示便于理解和记忆 1.3.1 IIS5.x与asp.net 1.3.2 IIS 6.0与asp.net 1.3.3 IIS7.0与asp.net 基于IIS ...

  10. 设计多选按钮ListChooseView

    设计多选按钮ListChooseView 答应某位女屌丝而写的控件,效果还不错,开源给大家^_^! 效果图: 源码: // // ListChooseView.h // ScrollChooseBut ...