在无网络的环境下,nodejs安装及vue-cli脚手架搭建
nodejs安装及vue离线环境搭建
记录在没有网络或者内网环境下,安装vue开发环境。
本文版本:node
nodejs安装及vue-cli脚手架搭建
nodejs安装
1.准备
在可以连接外网的电脑,下载自己电脑对应版本的nodejs安装包。
官网下载
下载成功后,将安装包拷贝到没有网络的电脑运行,一路下一步(安装目录可自行修改,本人安装目录:F:\Program Files\nodejs)。
安装完成后,先进行下简单的测试安装是否成功了,后面还要进行环境配置
在键盘按下【win+R】键,输入cmd,然后回车,打开cmd窗口
--查看node和npm的版本
node -v
npm -v
安装完后的目录如下图所示:
安装完成无node_global和node_cache文件夹
2.进行环境配置
(1)在我安装的【F:\Program Files\nodejs】文件夹下,创建两个文件夹【node_global】及【node_cache】如上图。
创建完两个空文件夹之后,打开cmd命令窗口,输入
npm config set prefix "F:\Program Files\nodejs\node_global"
npm config set cache "F:\Program Files\nodejs\node_cache"
(2)接下来设置环境变量,关闭cmd窗口,“我的电脑”-右键-“属性”
新建系统变量【NODE_PATH】
添加系统变量【Path】
如果有就不添加
检查用户变量(如果没有就添加)
在这里nodejs基本安装完成。
vue-cli脚手架搭建
1.准备
在外网环境下安装vue-cli脚手架
npm install -g @vue/cli
npm install -g webpack
npm install -g webpack-cli
npm install -g yarn
npm install -g typescript
并查看npm全局安装包的存放目录
npm config get cache
复制【F:\Program Files\nodejs\node_cache】和【F:\Program Files\nodejs\node_global】文件夹下node_cache和node_global文件到无网络电脑。
2.在无网络电脑上面安装拷贝的nodejs安装包,并配置相同环境。
将node_cache和node_global文件替换成外网电脑的文件夹。
3.查看全局命令是否正常
npm list -global --depth 0
如上图:说明vue-cli脚手架安装成功
4.运行项目
在网上下载一个vue项目,cmd运行进入项目如下图
(1)在拉下来的本地项目路径下输入npm install 命令安装项目所需要的一些包文件(node_modules文件,如下图)
运行成功生成node_modules文件夹
(2)还是在项目路径下输入命令 npm run serve 运行项目
(3)运行成功访问该网址
可以在浏览器访问下面网址
Local: http://localhost:8080
Network: http://10.20.32.25:8080
(4)异常记录
当运行(1)步出现以下异常
解决方法:
1)将有网的电脑上安装并运行成功vue项目的nodejs拷贝到无网络的电脑安装地址如图(nodejs为拷贝的文件夹)
2)将在有网的电脑把vue项目运行npm install命令的项目,拷贝到无网络电脑,直接运行npm run serve命令,成功
3)依次运行完下面代码,然后运行npm install命令,成功,亲测可用。
npm config set registry https://registry.npmjs.org/
npm config set proxy null // proxy:外部请求的代理
npm config set https-proxy null // https-proxy:用于代理https请求的
npm config set strict-ssl false//--偶尔不用运行
C:\Users\kaycee_yu(个人电脑名称不同)文件下的.npmrc文件
以上方法只能运行别人创建的Vue项目,无法自己创建Vue项目,欢迎大家有好的方法可以在评论区留言,相互学习。
常用命令:
//查看npm全局安装包的存放目录
npm config get cache
//查看npm全局安装目录
npm root -g
//查看全局命令是否正常
npm list -global --depth 0
//查看版本
vue -V
//打开Vue客户端
vue ui
更多推荐
所有评论(0)