博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
如何在Window下安装node\npm\cnpm,并安装vue.js,创建项目
阅读量:6570 次
发布时间:2019-06-24

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

1、安装node.js
node.js的官方地址为: 。
根据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进行安装。
参考网址为:
安装命令为: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来启动。
 

 

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

 

转载于:https://www.cnblogs.com/smallyi/p/7707118.html

你可能感兴趣的文章
php项目中常用的log日志记录方法
查看>>
Android--实现点击一次返回键返回桌面而不是退出应用
查看>>
LogParser 导入MSSQL
查看>>
左侧固定导航栏
查看>>
linux安装go环境并编写第一个go程序
查看>>
解决:laravel出现Please provide a valid cache path.
查看>>
[JAVA] String常用方法
查看>>
oracle
查看>>
兼容IE浏览器样式的html上传文件控件
查看>>
直接插入排序
查看>>
fstab中mount错误导致不能启动
查看>>
OSPF转发地址深入解析
查看>>
SQLServer的Top功能
查看>>
CentOS之crontab
查看>>
【在线研讨-现场文字】《敏捷开发用户故事分类与组织结构(二期-3)》2012-07-03...
查看>>
Hyper-V 2012 R2 配置存储QoS
查看>>
易语言 --什么情况下 用许可证
查看>>
项目总结:凡事预则立,不预则废!
查看>>
ORA-32004: obsolete and/or deprecated parameter(s)
查看>>
建属于自己的网站
查看>>