获取node安装包并解压
-
获取node安装包
wget https://npmmirror.com/mirrors/node/v16.14.0/node-v16.14.0-linux-x64.tar.xz
-
解压
tar -xvf node-v16.14.0-linux-x64.tar.xz
创建软链接
-
sudo ln -s 此文件夹的绝对路径/bin/node /usr/local/bin/node,具体执行如下:
sudo ln -s ~/npm/node-v16.14.0-linux-x64/bin/node /usr/local/bin/node
验证是否正常node -v
-
sudo ln -s 此文件夹的绝对路径/bin/npm /usr/local/bin/npm
sudo ln -s ~/npm/node-v16.14.0-linux-x64/bin/npm /usr/local/bin/npm
验证是否正常npm -v
将npm换为cnpm,淘宝本地源,并创建软链接(时间较长)
-
将npm换为cnpm 执行命令:
npm install cnpm -g --registry=https://registry.npm.taobao.org
-
创建软链接:
sudo ln -s 此文件夹的绝对路径/bin/cnpm /usr/local/bin/cnpm 详情如下:sudo ln -s ~/npm/node-v16.14.0-linux-x64/bin/cnpm /usr/local/bin/cnpm
安装vue
- 执行命令安装VUE
cnpm install vue@2.6.10
安装yarn
-
添加GPG key
curl -sS https://dl.yarnpkg.com/debian/pubkey.gpg | sudo apt-key add
-
添加源
echo "deb https://dl.yarnpkg.com/debian/ stable main" | sudo tee /etc/apt/sources.list.d/yarn.list
-
执行安装命令
sudo apt update && sudo apt install --no-install-recommends yarn
-
运行
yarn -v
测试是否成功
(若yarn不成功) 配置环境变量,若成功跳过此步
- 打开环境变量文件
vi ~/.bashrc
- 最后一行添加
export PATH="$PATH:`yarn global bin`" source ~/.bashrc
进入前端项目打包
备注说明:如果首次操作需要先将前端项目下载到服务器指定路径,例如:/home/narada/ems_frontend
-
进入前端目录
cd ems_frontend/
-
执行
yarn
-
执行打包命令
cnpm run build:prod
或
yarn run build:prod
打包成功,拷贝目录
打包成功后,将此目录下的dist文件夹拷贝到ems/www中,若无www文件夹则先新建www文件夹后拷贝
cp -rf dist /home/narada/ems/www/
确认打包的前端内容正常打包到对应的目录下如图:
访问测试环境地址验证是否成功,如果能正常访问即打包成功~