一、安装node.js(https://nodejs.org/en/

下载完毕后,可以安装node,建议不要安装在系统盘(如C:)。

二、设置nodejs prefix(全局)和cache(缓存)路径

1、在nodejs安装路径下,新建node_global和node_cache两个文件夹

2、设置缓存文件夹

npm config set cache "D:\vueProject\nodejs\node_cache"

 设置全局模块存放路径

npm config set prefix "D:\vueProject\nodejs\node_global"

设置成功后,之后用命令npm install XXX -g安装以后模块就在D:\vueProject\nodejs\node_global里

三、基于 Node.js 安装cnpm(淘宝镜像)

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

四、设置环境变量(非常重要)

说明:设置环境变量可以使得住任意目录下都可以使用cnpm、vue等命令,而不需要输入全路径
1、鼠标右键"此电脑",选择“属性”菜单,在弹出的“系统”对话框中左侧选择“高级系统设置”,弹出“系统属性”对话框。
2、修改系统变量PATH

3、新增系统变量NODE_PATH

五、安装Vue

cnpm install vue -g

六、安装vue命令行工具,即vue-cli 脚手架

cnpm install vue-cli -g

 七、新项目的创建

1.打开存放新建项目的文件夹

打开开始菜单,输入 CMD,或使用快捷键 win+R,输入 CMD,敲回车,弹出命令提示符。打开你将要新建的项目目录

2.根据模版创建新项目

在当前目录下输入“vue init webpack-simple 项目名称(使用英文)”。

vue init webpack-simple mytest

初始化完成后的项目目录结构如下:

3、安装工程依赖模块

定位到mytest的工程目录下,安装该工程依赖的模块,这些模块将被安装在:mytest\node_module目录下,node_module文件夹会被新建,而且根据package.json的配置下载该项目的modules

cd mytest
cnpm install

4、运行该项目,测试一下该项目是否能够正常工作,这种方式是用nodejs来启动。

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

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

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

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

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

  3. windows下搭建vue开发环境实践

    Vue.js是一套构建用户界面的 "渐进式框架".与其他重量级框架不同的是,Vue 采用自底向上增量开发的设计.Vue 的核心库只关注视图层,并且非常容易学习,非常容易与其它库或已 ...

  4. windows下搭建vue开发环境

    Vue.js是一套构建用户界面的 “渐进式框架”.与其他重量级框架不同的是,Vue 采用自底向上增量开发的设计.Vue 的核心库只关注视图层,并且非常容易学习,非常容易与其它库或已有项目整合.2016 ...

  5. windows下搭建vue开发环境+IIS部署 [转]

    特别说明:下面任何命令都是在windows的命令行工具下进行输入,打开命令行工具的快捷方式如下图:     详细的安装步骤如下: 一.安装node.js 说明:安装node.js的windows版本后 ...

  6. 二、windows下搭建vue开发环境+IIS部署

    有时我们的服务器并不一定是node,也许是IIS,这样我们就需要把工程构建出来,与IIS集成. 构建该项目的命令如下 cnpm run build 将dist文件夹拷贝出来,放到IIS的发布目录,在浏 ...

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

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

  8. Windows下搭建Git开发环境

    Windows下搭建Git开发环境主要有以下三种方法: 1,VS,vs2013和vs2015中已经集成了git插件了 2,msysGit+TortoiseGit 3,msysGit+SourceTre ...

  9. 如何在Windows上搭建Android开发环境

    Android开发越来越火,许多小伙伴们纷纷学习Android开发,学习Android开发首要任务是搭建Android开发环境,由于大家 主要实在Windows 上开发Android,下面就详细给大家 ...

随机推荐

  1. RNA-seq基本流程

    https://www.2cto.com/net/201801/714420.html

  2. html5 javascript 事件练习2

    <!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8&qu ...

  3. proc:基本数据库操作

    导师布置了一作业: 主要目的是学习数据库最基本的操作:创建用户.创建库表,和用程序访问数据库的相关技能(编码.编译等) 1,交易流水表(包含但不限于以下字段):交易日期.交易流水(用sequence实 ...

  4. js 计算后样式封装

    function getStyle(obj,attr){ // 需要获取的元素 属性 if(obj.currentStyle){ return obj.currentStyle[attr]; }els ...

  5. Beaglenone读取编码器数据

    一般情况下,beaglebone black默认启动两个cape: 1.BB-BONE-EMMC-2G 2.BB-BONELT-HDMI 我们可以通过编辑uEnv.txt的文件来决定是否启动HDMI, ...

  6. No Directionality widget found

    The problem is not that you have not wrapped your widgets into MaterialApp. As the documentation say ...

  7. Html 标签初知

    Html 标签初知 什么是Html 标签 超文本标记语言(外国语简称:HTML)标记标签通常被称为HTML标签,HTML标签是HTML语言中最基本的单位,HTML标签是HTML(标准通用标记语言下的一 ...

  8. Docker OpenvSwitch 应用部署

    Docker OpenvSwitch 应用部署 安装部署OVS并建立GRE隧道 节点1:192.168.1.198 容器网段:172.17.1.0/24 节点2:192.168.1.199 容器网段: ...

  9. Java调用第三方接口示范

    在项目开发中经常会遇到调用第三方接口的情况,比如说调用第三方的天气预报接口. 使用流程[1]准备工作:在项目的工具包下导入HttpClientUtil这个工具类,或者也可以使用Spring框架的res ...

  10. Python3 tkinter基础 Menubutton 点击按钮出现下拉菜单

             Python : 3.7.0          OS : Ubuntu 18.04.1 LTS         IDE : PyCharm 2018.2.4       Conda ...