Nodejs环境打包前端项目
Node.js 在Linux下安装和环境搭建/编译项目
安装nodejs:
1.下载nodejs源码包
wget https://nodejs.org/dist/v14.16.0/node-v14.16.0-linux-x64.tar.xz
#wget https://mirrors.tuna.tsinghua.edu.cn/nodejs-release/v10.5.0/node-v10.5.0-linux-x64.tar.xz
2.解压
xz -d node-v14.16.0-liunx-x64.tar.xz / tar -xzvf node-v14.16.0-liunx-x64.tar.gz
tar -xvf node-v6.10.3-liunx-x64.tar
3.创建软连接
mv node-v14.16.0-liunx-x64 /usr/local/nodejs
ln -s /usr/local/nodejs/bin/node /usr/local/bin/node
ln -s /usr/local/nodejs/bin/npm /usr/local/bin/npm
4.查看nodejs环境是否安装成功
node -v
npm -v
5.安装cnpm 使用淘宝源
npm install -g cnpm --registry=https://registry.npm.taobao.org
rm -rf /usr/local/bin/cnpm
ln -s /usr/local/nodejs/lib/node_modules/cnpm/bin/cnpm /usr/local/bin/cnpm
cnpm -v
编译项目:
需要先下载前端项目源代码/ 然后进入项目代码目录
# 例如:
git clone http://192.168.16.20/tiptop-statement/web-client.git cd web-clent
安装项目所需依赖
cnpm install
项目打包
# fef test
cnpm run build
如果打包过程中,fef命令无法使用,做如下操作:
注: 这里打包项目 需要fef命令,因为手动安装容易失败,所以上传我编译好的nodejs目录文件包。

解压到/root/家目录下 并且设置软连接:
find / -name feflow
ln -s /root/.npm-global/lib/node_modules/@feflow/cli/bin/feflow /usr/local/bin/fef
# 生效变量
source /root/.bashrc
项目打包完成后,会额外生成一个文件夹 dist 。 主要将文件夹中的内容拷贝到nginx或者httpd的发布目录下即可。
例如是nginx
# 先备份原来的项目代码
tar czf web.tar.gz /usr/local/nginx/html/* /data/backup/ # 拷贝打包好的项目代码到nginx发布目录
cp -r dist/* /usr/local/nginx/html/
Jenkins配合shell脚本案例
case $Status in
Deploy)
{
echo "Status:$Status"
echo "version:$BUILD_NUMBER"
NPM_PATH="/usr/local/bin/cnpm"
FEF_PATH="/usr/local/fef_test/bin/fef"
BACKUP_PATH="/backup/batar-entrance-guard/entrance-guard-web"
PROJECT_FILE="/project/batar-entrance-guard/entrance-guard-web/dist"
cd $WORKSPACE
source /home/batar-exam/.bashrc
sudo $NPM_PATH install
/usr/local/fef_test/bin/fef test
if [[ -d ${PROJECT_FILE} ]];then
rm -rf $PROJECT_FILE
fi
cp -rf $WORKSPACE/dist $PROJECT_FILE
#备份项目文件
cp -rf $WORKSPACE/dist $BACKUP_PATH/$BUILD_NUMBER-dist
}
;;
Rollback)
{
echo "Status:$Status"
echo "version:$Version"
BACKUP_PATH="/backup/batar-entrance-guard/entrance-guard-web"
PROJECT_FILE="/project/batar-entrance-guard/entrance-guard-web/dist"
if [[ -d ${PROJECT_FILE} ]];then
rm -rf $PROJECT_FILE
fi
cp -rf $BACKUP_PATH/$Version-dist $PROJECT_FILE
}
;;
*)
exit
;;
esac
Nodejs环境打包前端项目的更多相关文章
- npm打包前端项目太慢问题分析以及暂时解决方案
npm build 打包前端项目实际上是执行 node build/build.js,但是随着项目的依赖包越来越多,项目打包时间不断延长,为了改善这个问题,需要从node入手 暂时解决方案:扩大nod ...
- jenkins打包前端项目报 error: index-pack died of signal 15 问题解决
jenkins打包前端项目报 error: index-pack died of signal 15 问题解决 前几天用jenkins打包一个前端项目的时候出现了 error: index-pack ...
- Angular企业级开发(6)-使用Gulp构建和打包前端项目
1.gulp介绍 基于流的前端自动化构建工具,利用gulp可以提高前端开发效率,特别是在前后端分离的项目中.使用gulp能完成以下任务: 压缩html.css和js 编译less或sass等 压缩图片 ...
- 如何使用webpack打包前端项目
webpack概述 随着前端体积越来越大,功能越来越丰富,这时候就需要将前端工程化,而 webpack就是用于将前端各种文件打包起来. 一个简单的webpack应该包含以下几个概念 · 入口起点 · ...
- Docker + webpack 打包前端项目
码云代码地址: https://gitee.com/caonimashi/docker_deployment_front_end 构建基础镜像: 1.下载一个 Apline Linux 操作系统 ...
- Github配合Jenkins,实现vue等前端项目的自动构建与发布
本篇文章前端项目以vue为例(其实前端工程化项目的操作方法都相同),部署在Linux系统上(centos). 之前做前端项目的部署,一直都是手动运行打包命令,打包完.再使用FTP.Xshell等这类的 ...
- Docker+Jenkins持续集成环境(2)使用docker+jenkins构建nodejs前端项目
前文使用Docker搭建Jenkins+Docker持续集成环境我们已经搭建了基于docker+jenkins的持续集成环境,并构建了基于maven的项目.这一节,我们继续扩展功能,增加对Nodejs ...
- Jenkins结合shell脚本实现(gitLab/gitHub)前端项目自动打包部署服务器
原始发布部署: 石器时代的我们,先是本地打包好项目,在去服务器上把原来的文件删了,然后回到本地copy到服务器: 这操看起来简单,实际部署的人就知道多烦了,假如来几个项目都要重新发布:那就爽了: 今天 ...
- 前端项目模块化的实践2:使用 Webpack 打包基础设施代码
以下是关于前端项目模块化的实践,包含以下内容: 搭建 NPM 私有仓库管理源码及依赖: 使用 Webpack 打包基础设施代码: 使用 TypeScript 编写可靠类库 使用 TypeScript ...
- nodejs解压版安装和配置(带有搭建前端项目脚手架)
nodejs 安装 我先前用了nvm,觉得nvm挺厉害可以随时更换nodejs版本,但是研究了下,可能自己功力不够还是什么,并不好用,中间还出现了错误:所以最后还是卸载了: 本文图文并茂的一步一步的 ...
随机推荐
- MODBUS-TCP转Ethernet IP 网关连接空压机配置案例
本案例是工业现场应用捷米特JM-EIP-TCP的Ethernet/IP转Modbus-TCP网关连接欧姆龙PLC与空压机的配置案例.使用设备:欧姆龙PLC,捷米特JM-EIP-TCP网关, ETHER ...
- Flex布局常用属性详解
1. Flex布局与响应式布局 1.1 为什么需要响应式布局? 在电脑PC端,使用浮动,定位同时使用像素px单位就可以完成大部分布局,而且布局完之后不会有大问题,但是到了移动端,移动设备的屏幕尺寸多种 ...
- 如何构建高效、可观的系统「GitHub 热点速览」
经典老项目 system-design 教你如何设计一个健壮的系统,新项目 noodle 教你如何提升教育效率,而后者甚至单日获得了 1,600 star,刚开源就获得了 6k+ 的 star. 除了 ...
- 【SpringBoot】Session共享
本文参考 Spring Boot 一个依赖搞定 session 共享,没有比这更简单的方案了! 在传统的单服务架构中,只有一个服务器,那就不会存在session共享的问题,但如果在分布式/集群项目中, ...
- ZEGO自研RTC+直播系统架构,如何支撑一场高质量直播
近年来得益于网络基础设施的进步,实时音视频(Real-Time Communication,以下简称 RTC)和直播(采用 CDN 进行内容分发)在各行业迅速落地,在疫情的催化下更是推动传统的教育.会 ...
- js中数组的方法,32种方法
数组的32中方法=>{ 1.push(): 在数组末尾添加一个或多个元素,并返回修改后的数组. let fruits = ['apple', 'banana', 'orange']; fruit ...
- Struts2 小知识点
配置struts.xml文件,选择开发模式 在实际应用开发或者是产品部署的时候,对应着两种模式: 开发模式(devMode):此时 DevMode=ture: 产品模式(proMode):此时 Dev ...
- AcWing 第 92 场周赛 C题 4866. 最大数量 题解
原题链接 链表 + 并查集乱搞做法: 思路 首先可以发现,想要让度数尽量大,那我们应该构造成菊花图,即下图所示: 对于每个需求,我们可以知道,如果之前他们没有连在一起,那我们一定得把他们连在一起,该过 ...
- 浅析三维模型OBJ格式轻量化处理常见问题与处理措施
浅析三维模型OBJ格式轻量化处理常见问题与处理措施 在三维模型OBJ格式轻量化处理过程中,可能会遇到一些问题.以下是一些常见问题以及相应的解决方法: 1.文件大小过大: OBJ格式的三维模型文件通常包 ...
- Linux 内核 ASoC DMA 引擎驱动程序
Linux 内核 ASoC 框架,在概念上将嵌入式音频系统拆分为多个可复用的组件驱动程序,包括 Codec 类驱动程序.平台类驱动程序和机器类驱动程序.在实现上,机器类驱动程序用 struct snd ...