teamcity 配置npm自动化构建

本文介绍了如何使用TeamCity进行前端项目的自动化构建,包括`npm install`解决权限问题,`npm build`执行构建,以及通过SSH Upload将构建结果上传到服务器的详细步骤。通过这些配置,实现了前后端项目的自动化构建与部署,极大地提高了团队开发效率。

      在前一篇我们看过了通过teamcity构建maven项目,那这只是后端的自动化构建。在今天前后端分离的趋势之下,那前端项目是否也能自动化构建呢。答案是肯定的,同样通过teamcity自动化构建加部署。安装以及将项目拉到teamcity中作者就不在赘述,在我的前一篇文章中以及说明了。直接上Build step,同样是三步。

 

一:npm install

      

new一个Command Line的Build Step步骤,接下来我们配置内容。

这里我们也不需要填太多信息:

step name是构建步骤的别名,可填可不填。

重要的是在Custom script中说写的install命令行,这里举出几个错误示例:

1.npm install 

当你输入此命令行时,会出现权限问题。

在页面右上角,run键的旁边Build Configuration Home,选中你的失败构建查看Build Log。会发现爆出一个权限错误。

要知道,我们执行命令的就是root用户,所以很奇怪,居然用root帐号会出现权限问题。

那么我们加上sudo,变成sudo npm install

同样的,查看构建日志,发现报错。

使用sudo居然会没有npm命令,这就是我们服务器的问题了。让我们登上自己的服务器,配置一下sudo的npm。

sudo ln -s /usr/local/bin/node /usr/bin/node
sudo ln -s /usr/local/lib/node /usr/lib/node
sudo ln -s /usr/local/bin/npm /usr/bin/npm
sudo ln -s /usr/local/bin/node-waf /usr/bin/node-waf

ok,这时我们再回过头来看sudo npm install,执行顺利。那就进行我们的第二步吧!

二:npm build

同样的,重复第一步添加一个Command Line。配置内容:

好的,这边就只有一条命令,就是npm run build构建

三:SSH Upload上传

这步在作者上一篇轮到maven的自动化构建已经说过啦,这里就直接上配置吧

在Target中填入ip:/,制定部署目标

Deployment Credentials中选择Password输入服务器的帐号密码

在Paths to sources中将要上传的文件输入,作者在这里只要上传一个build之后的dist文件夹,因为在这里面已经有html和css、js之类的文件,而=>后面跟的则是要在服务器中放置的目录。注意,这里是从根目录开始哦~~

好了,至此前后端的项目都能通过自动化构建上传发布啦,不得不说,这在团队开发过程中,应该是帮了极大的忙。非常好用!

评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值