npm安装不能使用问题(如安装 vue-cli,webpack)等

Posted 爱代码三千

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了npm安装不能使用问题(如安装 vue-cli,webpack)等相关的知识,希望对你有一定的参考价值。

首先如果想要安装vue-cli ,webpack这些的时候我们都会用到node里边npm模块,但是有的初学者在安装时候总会出现一些问题,导致npm不能运作,致使vue-cli,webpack等不能安装。这时候帮助大家解决一下

npm :nodejs 中的包管理器
webpack:把所有的客户端需要发布的静态资源准备好,进行资源的打包,合并等
vue-cli :用户生成的Vue工程模板。
vue-router:路由(这个不用解释的)。

一、下载node 。 下载地址:http://nodejs.cn/download/

 
技术图片
 

 

 

我的是windows系统,这是现在对应的最新安装包
 
技术图片
2345截图20180418115918.jpg

 
技术图片
1.jpg
 
技术图片
2.jpg
 
技术图片
3.jpg

二、找得到安装nodejs那个文件夹

 
技术图片
4.jpg

打开cmd,检查一下

 
技术图片
5.jpg

都已经安装好了。

但是本地仓库都跑到C盘了,所以我们需要修改路径

 
技术图片
6.jpg

//现在nodejs文件夹下创建node_global,node_cache这俩个文件

 
技术图片
7.jpg

然后在cmd中运行

1.npm config set prefix ‘‘G: odejs ode_globle"

2.npm config set cache ‘‘G: odejs ode_cache"

 
技术图片
8.jpg

输入npm config list查看所有的配置信息

 
技术图片
9.jpg

检查镜像命令是否正常 npm config get registry

 
技术图片
10.jpg

用npm info vue看看是不是能获取vue的信息

 
技术图片
11.jpg

然后用npm install npm -g将npm更新到最新版本

 
技术图片
12.png

我们再查看一下npm list -g 会发现全局目录不是空目录了

 
技术图片
14.jpg

这时,默认的模块路径G: odejs ode_modules变为G: odejs ode_global ode_modules,这个时候运行npm install命令会报错,如运行npm install vue

 
技术图片
15.jpg

这时候我们需要在环境变量的系统变量里添加NODE_PATH,内容是G: odejs ode_global ode_modules

 
技术图片
17.jpg

这里运行还会发生错误项目无法安装,那么这事后我们就要找到图片9中.npmrc对应的文件夹,

 
技术图片
18.jpg

把.npmrc文件删,之后就会下载对应文件

 
技术图片
19.jpg

之后在把环境变量中的系统变量Path配置一下就好

 
技术图片
20.jpg
 
技术图片
21.jpg

然后就可以安装 vue ,vue-cli ,

 
技术图片
22.jpg

注意:vue-cli工具是内置了模板,包括webpack 和 webpack-simple,并且他的配置并不是全放在了根目录下的webpack。config.js中

重新开启cmd

先初始化 vue init webpack-simple oneNight01,根据步骤生成成功界面

 
技术图片
25.jpg
 
技术图片


作者:舟渔行舟
链接:https://www.jianshu.com/p/9f11b367b900
来源:简书
著作权归作者所有。

以上是关于npm安装不能使用问题(如安装 vue-cli,webpack)等的主要内容,如果未能解决你的问题,请参考以下文章

VUE-CLI Vue安装及开发,npm run build无法查看项目的问题

介绍vue-cli

vue-cli安装

npm 安装vue-cli

Vue-cli

vue-cli 搭建