1、安装node.js
node.js的官方地址为:https://nodejs.org/en/download/
根据windows版本后,选择要下载的安装包,下载完毕,按照windows一般应用程序,一路next就可以安装成功,建议不要安装在系统盘(如C:)。
 
2、设置global和cache路径
设置路径能够把通过npm安装的模块集中在一起,便于管理。
(1)在nodejs的安装目录下,新建node_global和node_cache两个文件夹,如安装目录为“D:\nodejs\”
(2)用命令npm config set prefix "D:\nodejs\node_global"和npm config set cache "D:\nodejs\node_cache"设置global和cache,设置成功后,后续用命令npm install -g XXX安装,模块就在D:\nodejs\node_global\node_modules里。
 
3、设置环境变量

说明:设置环境变量可以使得住任意目录下都可以使用cnpm、vue等命令,而不需要输入全路径。
(1)修改用户变量PATH:把"D:\nodejs\node_global"加到后面。
(2)新增系统变量NODE_PATH:设置成“D:\nodejs\node_global\node_modules”。
 
4、安装cnpm
说明:由于许多npm包都在国外,用淘宝的镜像服务器,对依赖的module进行安装。
参考网址为:http://npm.taobao.org/
安装命令为:npm install -g cnpm --registry=https://registry.npm.taobao.org
5、用cnpm安装vue
安装命令为:cnpm install vue -g
 
安装好后碰到一个问题
cmd命令下cnpm显示不是内部命令,其实走了那么多弯路,就是因为将其文件的在--2、设置global和cache路径中改变了

npm所在目录C:\Program Files\nodejs   和D:\Program Files\nodejs\node_modules\npm

cnpm所在目录C:\Program Files\nodejs\node_global和D:\Program Files\nodejs\node_global\node_modules\cnpm

所以在设置一下环境变量就可以解决问题的,一直搞不明白,原因就在这

添加安装cnpm文件的目录路径就可以, 比如:C:\Program Files\nodejs\node_global

就okl

 
6、安装vue命令行工具
安装命令为:cnpm install vue-cli -g
7、创建工程

(1)cd命令进入将要新建工程的目录,如“E:\nodejs”
用命令"vue init webpack mytest"创建一个基于 webpack 模板的新项目,工程名为"mytest"。
(2)cd命令进入mytest目录
(3)安装该工程依赖的模块
用命令"cnpm install”安装该工程依赖的模块,这些模块将被安装在:mytest\node_module目录下,node_module文件夹会被新建,而且根据package.json的配置下载该项目的modules。

(这里用国内的阿里的cnpm安装比较快)

(4)运行项目
用命令“cnpm run dev”测试该项目是否能够正常工作,用nodejs来启动。
 

然后,就自动在浏览器运行了项目了

如何在Window下安装node\npm\cnpm,并安装vue.js,创建项目的更多相关文章

  1. 如何在安装node\npm\cnpm

    1.安装node.js node.js的官方地址为:https://nodejs.org/en/download/. 根据windows版本后,选择要下载的安装包,下载完毕,按照windows一般应用 ...

  2. Mac 安装node npm cnpm vue 以及卸载 node 和 npm 的方法 清空npm缓存的方法

    S01 安装node(内含npm) 首先,到官网下载长期支持版,截止目前,最新的长期支持版本号是10.16.3 https://nodejs.org/zh-cn/download/ 下载完毕后,安装该 ...

  3. npm cnpm yarn 安装

    安装node.js,其中已经集成了npm,可以将npm切换到国内镜像 $ npm config set registry https://registry.npm.taobao.org -- 配置后可 ...

  4. linux 卸载安装node npm

    1. 卸载node npm (1) 先卸载 npm: sudo npm uninstall npm -g (2) 然后卸载 Node.js. (2.1) 如果是 Ubuntu 系统并使用 apt-ge ...

  5. 卸载安装node npm (Mac linux )

    1. 卸载node npm (1) 先卸载 npm: sudo npm uninstall npm -g (2) 然后卸载 Node.js. (2.1) 如果是 Ubuntu 系统并使用 apt-ge ...

  6. (转 留存)Windows环境下的NodeJS+NPM+GIT+Bower安装配置步骤

    Windows环境下的NodeJS+NPM+GIT+Bower安装配置步骤 标签: NodeJSnpmbower 2015-07-17 16:38 3016人阅读 评论(0) 收藏 举报  分类: G ...

  7. window下在同一台机器上安装多个版本jdk,修改环境变量不生效问题处理办法

    window下在同一台机器上安装多个版本jdk,修改环境变量不生效问题处理办法 本机已经安装了jdk1.7,而比较早期的项目需要依赖jdk1.6,于是同时在本机安装了jdk1.6和jdk1.7. 安装 ...

  8. window下如何使用文本编辑器(如记事本)创建、编译和执行Java程序

    window下如何使用文本编辑器(如记事本)创建Java源代码文件,并编译执行 第一步:在一个英文目录下创建一个 .text 文件 第二步:编写代码 第三步:保存文件 方法一:选择 文件>另存为 ...

  9. CentOS 下安装 Node npm pm2

    1.node安装 参考:http://blog.csdn.net/haidaochen/article/details/7257655 下载,你需要在https://nodejs.org/en/dow ...

随机推荐

  1. [properJavaRDP]在网页中实现远程连接

    内容摘要: 利用开源软件properJavaRDP实现远程桌面连接 如何让Applet嵌入到网页中正常运行 如何处理连接win7时的异常:Wrong modulus size! Expected 64 ...

  2. jeecg字典表-系统字典

    新建字典 录入字典信息 添加类型 录入完类型后效果 新建列表用户 保存 同步数据库 同步完之后,对应的数据库中会创建对应的表. 测试表功能 保存之后,数据库保存对应的字段 生成代码 刷新工程之后,生成 ...

  3. idea注册码到期,破解idea

    http://idea.lanyus.com/    

  4. mysql client--笔记-修改密码-登录-查看数据库-创建数据库

    1 登录 mysql client 打开 mysql client -输入密码 123 回车 2 show database; ---显示数据库 3 切换数据库:use mysql 4 describ ...

  5. Magento 最佳开发配置

    概观 典型的软件开发流程如下: 本地开发机器 > QA /集成服务器 > 预览服务器(可选)> 生产服务器 无论您是在编写新的Magento 2 扩展 还是为代码库做贡献,任何开发人 ...

  6. BSGS+exBSGS POJ2417+POJ3243

    a^x=b(mod p)求x,利用分块的思想根号p的复杂度求答案,枚举同余式两端的变量,用hash的方法去找最小的答案(PS:hash看上去很像链式前向星就很有好感).然后如果p不是质数时,就利用同余 ...

  7. [TJOI2015]概率论

    [TJOI2015]概率论 史上最短黑题 看起来一脸懵逼,没有取模,1e-9 根据期望定义,发现 分母是一个卡特兰数,,,,不能直接算 所以考虑怎么消掉一些东西 gn表示n个点的叶子个数和,fn表示n ...

  8. Redux Counter example

    此项目模板是使用Create React App构建的,它提供了一种简单的方法来启动React项目而无需构建配置. 使用Create-React-App构建的项目包括对ES6语法的支持,以及几种非官方 ...

  9. Vue, React, AngularJS, Angular2 我们对流行JavaScript框架们的选择

    转自<奇舞周刊>,好文章mark一下 分割线 一个有趣的事实是:IBM发表的2017年最值得学习的编程语言名单中,JavaScript榜上有名.这位IT巨头指出,JS在网站中惊人地达到94 ...

  10. 线性布局LinearLayout

    常用属性 id:控件唯一属性 android:id="@+id/ll_1" --------------------------------------- layout_width ...