由于公司开发环境无法联网,又使用了VUE作为前端框架。所以需要搭建一套内网的VUE完整开发环境。
公司已经使用Nexus Repository Manager OSS 3.x搭建了一套Maven私服,这个也可以用来作为npm私服,官网还给了篇文档Nexus Repository Manager-代理Maven和npm快速入门。
1.搭建npm私服
网上已经有很多使用Nexus2或Nexus3搭建npm私服的文档,这里不再多说。但是如果你的VUE工程使用了node-sass或其它命令工具,仅仅只对淘宝 NPM 镜像进行代理是不行的,我们还需要对淘宝开源镜像进行代理。
如果您当前使用的是Nexus2,需要创建一个hosted仓库,然后将您需要文件上传到该仓库。
如果您当前使用的Nexus3,直接创建一个RAW格式的代理仓库,远程地址配置为https://npm.taobao.org/mirrors即可,如下图所示:
2.安装Node.js
安装过程略...
3.设置NPM镜像地址
以管理员身份运行cmd,执行以下命令:
rem 设置npm镜像地址
npm config set registry http://ip:port/repository/npm-public/
npm config set sass_binary_site http://ip:port/repository/npm-dist/node-sass
3.安装node-gyp的运行环境
前端VUE工程如果使用了node-sass,则需要先安装node-gyp。在进行install过程中,node-sass和node-gyp工具会自动进行安装,但其编译需要的python2.7和微软的Visual C++构建工具则需要我们手动安装,安装方式有两种,任选一种即可。
在线安装
使用命令自动安装python2.7以及VC++ build Tools,以管理员身份运行cmd,执行以下命令即可:
npm install --global --production windows-build-tools
离线安装
对于不能访问外网的电脑,我们需要手动安装Python2.7和Visual C++ 运行库。
-
安装python2.7
在进行Python2.7的安装时,选择Add python.exe to Path中的Entire feature will be installed on local hard drive可以自动将Python添加到环境变量中,也可以在安装之后手动设置Python的环境变量,如下图所示:
- 安装Visual C++运行库
通过最新支持的 Visual C++ 下载下载Visual C++ 运行库,然后直接进行安装即可。
4.VUE工程的编译
在当前VUE工程目录进入cmd,直接执行yarn install和yarn run serve即可正常启动工程。
其所依赖的node-sass、node-gyp会自动进行安装。