一佳互联
虚拟化容器,大数据,DBA,中间件,监控。

Jenkins 常用的项目构建工具集成 04 npm yarn

21 12月
作者:admin|分类:系统运维

npm

前端项目的构建使用npm,前端项目下载node.js

官网：Download | Node.js

安装npm

wget https://nodejs.org/dist/v14.16.1/node-v14.16.1-linux-x64.tar.xz
tar xf node-v14.16.1-linux-x64.tar.xz -C /usr/local/


[root@zeyang-nuc-service node-v14.16.1-linux-x64]# vi /etc/profile

export NODE_HOME=/usr/local/node-v14.16.1-linux-x64
export PATH=$NODE_HOME/bin:$PATH


[root@zeyang-nuc-service node-v14.16.1-linux-x64]# source /etc/profile
[root@zeyang-nuc-service node-v14.16.1-linux-x64]#
[root@zeyang-nuc-service node-v14.16.1-linux-x64]# node -v
v14.16.1
[root@zeyang-nuc-service node-v14.16.1-linux-x64]# npm -v
6.14.12

 通过下面的命令，初始化一个vue项目

[root@zeyang-nuc-service node-v14.16.1-linux-x64]# npm install -g vue
+ vue@2.6.12
added 1 package from 1 contributor in 3.342s
[root@zeyang-nuc-service node-v14.16.1-linux-x64]# vue-init  webpack vuedemo

? Project name vuedemo
? Project description A Vue.js project
? Author adminuser <2560350642@qq.com>
? Vue build standalone
? Install vue-router? No
? Use ESLint to lint your code? No
? Set up unit tests No
? Setup e2e tests with Nightwatch? No
? Should we run `npm install` for you after the project has been created? (recommended) npm

   vue-cli · Generated "vuedemo".

这个是一个vue前端的项目，怎么打包呢？先去install去安装其依赖，没问题之后再去run buid去打包

常用命令

  • npm install <moduleName> -g   包安装到全局
  • npm list：查看当前已安装的包。
  • npm config set registry https://registry.npm.taobao.org   设置淘宝源
  • npm config set cache  "/opt/npmcache/"   设置缓存路径
root@jenkins-master devops-web-service-master]# npm install
[            ......] / extract:caniuse-db: sill extract caniuse-db@1.0.30001208 extracted to /root/devops-web-service-master/node_m

> core-js@2.6.12 postinstall /root/devops-web-service-master/node_modules/core-js
> node -e "try{require('./postinstall')}catch(e){}"

Thank you for using core-js ( https://github.com/zloirock/core-js ) for polyfilling JavaScript standard library!

The project needs your help! Please consider supporting of core-js on Open Collective or Patreon: 
> https://opencollective.com/core-js 
> https://www.patreon.com/zloirock 

Also, the author of core-js ( https://github.com/zloirock ) is looking for a good job -)


> ejs@2.7.4 postinstall /root/devops-web-service-master/node_modules/ejs
> node ./postinstall.js

Thank you for installing EJS: built with the Jake JavaScript build tool (https://jakejs.com/)


> uglifyjs-webpack-plugin@0.4.6 postinstall /root/devops-web-service-master/node_modules/webpack/node_modules/uglifyjs-webpack-plugin
> node lib/post_install.js

npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.2.13 (node_modules/webpack-dev-server/node_modules/fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.2.13: wanted {"os":"darwin","arch":"any"} (current: {"os":"linux","arch":"x64"})
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.2.13 (node_modules/watchpack-chokidar2/node_modules/fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.2.13: wanted {"os":"darwin","arch":"any"} (current: {"os":"linux","arch":"x64"})
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@2.3.2 (node_modules/fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@2.3.2: wanted {"os":"darwin","arch":"any"} (current: {"os":"linux","arch":"x64"})

added 1272 packages from 675 contributors and audited 1279 packages in 169.809s

47 packages are looking for funding
  run `npm fund` for details

found 60 vulnerabilities (3 low, 50 moderate, 7 high)
  run `npm audit fix` to fix them, or `npm audit` for details

然后去打包

[root@jenkins-master devops-web-service-master]# npm run build

> vuedemo@1.0.0 build /root/devops-web-service-master
> node build/build.js

?.building for production...(node:28710) Warning: Accessing non-existent property 'cat' of module exports inside circular dependency
(Use `node --trace-warnings ...` to show where the warning was created)
(node:28710) Warning: Accessing non-existent property 'cd' of module exports inside circular dependency
(node:28710) Warning: Accessing non-existent property 'chmod' of module exports inside circular dependency
(node:28710) Warning: Accessing non-existent property 'cp' of module exports inside circular dependency
(node:28710) Warning: Accessing non-existent property 'dirs' of module exports inside circular dependency
(node:28710) Warning: Accessing non-existent property 'pushd' of module exports inside circular dependency
(node:28710) Warning: Accessing non-existent property 'popd' of module exports inside circular dependency
(node:28710) Warning: Accessing non-existent property 'echo' of module exports inside circular dependency
(node:28710) Warning: Accessing non-existent property 'tempdir' of module exports inside circular dependency
(node:28710) Warning: Accessing non-existent property 'pwd' of module exports inside circular dependency
(node:28710) Warning: Accessing non-existent property 'exec' of module exports inside circular dependency
(node:28710) Warning: Accessing non-existent property 'ls' of module exports inside circular dependency
(node:28710) Warning: Accessing non-existent property 'find' of module exports inside circular dependency
(node:28710) Warning: Accessing non-existent property 'grep' of module exports inside circular dependency
(node:28710) Warning: Accessing non-existent property 'head' of module exports inside circular dependency
(node:28710) Warning: Accessing non-existent property 'ln' of module exports inside circular dependency
(node:28710) Warning: Accessing non-existent property 'mkdir' of module exports inside circular dependency
(node:28710) Warning: Accessing non-existent property 'rm' of module exports inside circular dependency
(node:28710) Warning: Accessing non-existent property 'mv' of module exports inside circular dependency
(node:28710) Warning: Accessing non-existent property 'sed' of module exports inside circular dependency
(node:28710) Warning: Accessing non-existent property 'set' of module exports inside circular dependency
(node:28710) Warning: Accessing non-existent property 'sort' of module exports inside circular dependency
(node:28710) Warning: Accessing non-existent property 'tail' of module exports inside circular dependency
(node:28710) Warning: Accessing non-existent property 'test' of module exports inside circular dependency
(node:28710) Warning: Accessing non-existent property 'to' of module exports inside circular dependency
(node:28710) Warning: Accessing non-existent property 'toEnd' of module exports inside circular dependency
(node:28710) Warning: Accessing non-existent property 'touch' of module exports inside circular dependency
(node:28710) Warning: Accessing non-existent property 'uniq' of module exports inside circular dependency
(node:28710) Warning: Accessing non-existent property 'which' of module exports inside circular dependency
Hash: c5df099009c25bc0dbca
Version: webpack 3.12.0
Time: 11333ms
                                                  Asset       Size  Chunks             Chunk Names
                  static/js/app.2f2e5edd9af2c59aa514.js    11.5 kB       0  [emitted]  app
               static/js/vendor.0aad2172a75b8ed4f46c.js    94.8 kB       1  [emitted]  vendor
             static/js/manifest.2ae2e69a05c33dfc65f8.js  857 bytes       2  [emitted]  manifest
    static/css/app.30790115300ab27614ce176899523b62.css  432 bytes       0  [emitted]  app
static/css/app.30790115300ab27614ce176899523b62.css.map  797 bytes          [emitted]  
              static/js/app.2f2e5edd9af2c59aa514.js.map    21.7 kB       0  [emitted]  app
           static/js/vendor.0aad2172a75b8ed4f46c.js.map     494 kB       1  [emitted]  vendor
         static/js/manifest.2ae2e69a05c33dfc65f8.js.map    4.97 kB       2  [emitted]  manifest
                                             index.html  509 bytes          [emitted]  

  Build complete.

  Tip: built files are meant to be served over an HTTP server.
  Opening index.html over file:// won't work.

这里多了dist目录，这里可以看到静态文件，后期就是将静态文件打包传到服务器上面，也就是网站根目录要发的包。

[root@jenkins-master devops-web-service-master]# ls
build  config  dist  index.html  Jenkinsfile  Jenkinsfile1  node_modules  package.json  package-lock.json  README.md  src  static
[root@jenkins-master devops-web-service-master]# cd dist/
[root@jenkins-master dist]# ls
index.html  static
[root@jenkins-master dist]# ls static/
css  js

yarn

yarn，facebook取代npm的包管理工具，速度快。Yarn 缓存包，无需重复下载。 并行下载，安装速度快。

安装配置

npm install -g yarn
yarn info
[root@jenkins-master devops-web-service-master]# yarn install
[root@jenkins-master devops-web-service-master]# yarn build
yarn run v1.22.10
$ node build/build.js
?.building for production...(node:29002) Warning: Accessing non-existent property 'cat' of module exports inside circular dependency
(Use `node --trace-warnings ...` to show where the warning was created)
(node:29002) Warning: Accessing non-existent property 'cd' of module exports inside circular dependency
(node:29002) Warning: Accessing non-existent property 'chmod' of module exports inside circular dependency
(node:29002) Warning: Accessing non-existent property 'cp' of module exports inside circular dependency
(node:29002) Warning: Accessing non-existent property 'dirs' of module exports inside circular dependency
(node:29002) Warning: Accessing non-existent property 'pushd' of module exports inside circular dependency
(node:29002) Warning: Accessing non-existent property 'popd' of module exports inside circular dependency
(node:29002) Warning: Accessing non-existent property 'echo' of module exports inside circular dependency
(node:29002) Warning: Accessing non-existent property 'tempdir' of module exports inside circular dependency
(node:29002) Warning: Accessing non-existent property 'pwd' of module exports inside circular dependency
(node:29002) Warning: Accessing non-existent property 'exec' of module exports inside circular dependency
(node:29002) Warning: Accessing non-existent property 'ls' of module exports inside circular dependency
(node:29002) Warning: Accessing non-existent property 'find' of module exports inside circular dependency
(node:29002) Warning: Accessing non-existent property 'grep' of module exports inside circular dependency
(node:29002) Warning: Accessing non-existent property 'head' of module exports inside circular dependency
(node:29002) Warning: Accessing non-existent property 'ln' of module exports inside circular dependency
(node:29002) Warning: Accessing non-existent property 'mkdir' of module exports inside circular dependency
(node:29002) Warning: Accessing non-existent property 'rm' of module exports inside circular dependency
(node:29002) Warning: Accessing non-existent property 'mv' of module exports inside circular dependency
(node:29002) Warning: Accessing non-existent property 'sed' of module exports inside circular dependency
(node:29002) Warning: Accessing non-existent property 'set' of module exports inside circular dependency
(node:29002) Warning: Accessing non-existent property 'sort' of module exports inside circular dependency
(node:29002) Warning: Accessing non-existent property 'tail' of module exports inside circular dependency
(node:29002) Warning: Accessing non-existent property 'test' of module exports inside circular dependency
(node:29002) Warning: Accessing non-existent property 'to' of module exports inside circular dependency
(node:29002) Warning: Accessing non-existent property 'toEnd' of module exports inside circular dependency
(node:29002) Warning: Accessing non-existent property 'touch' of module exports inside circular dependency
(node:29002) Warning: Accessing non-existent property 'uniq' of module exports inside circular dependency
(node:29002) Warning: Accessing non-existent property 'which' of module exports inside circular dependency
Hash: c5df099009c25bc0dbca
Version: webpack 3.12.0
Time: 10486ms
                                                  Asset       Size  Chunks             Chunk Names
                  static/js/app.2f2e5edd9af2c59aa514.js    11.5 kB       0  [emitted]  app
               static/js/vendor.0aad2172a75b8ed4f46c.js    94.8 kB       1  [emitted]  vendor
             static/js/manifest.2ae2e69a05c33dfc65f8.js  857 bytes       2  [emitted]  manifest
    static/css/app.30790115300ab27614ce176899523b62.css  432 bytes       0  [emitted]  app
static/css/app.30790115300ab27614ce176899523b62.css.map  797 bytes          [emitted]  
              static/js/app.2f2e5edd9af2c59aa514.js.map    21.7 kB       0  [emitted]  app
           static/js/vendor.0aad2172a75b8ed4f46c.js.map     494 kB       1  [emitted]  vendor
         static/js/manifest.2ae2e69a05c33dfc65f8.js.map    4.97 kB       2  [emitted]  manifest
                                             index.html  509 bytes          [emitted]  

  Build complete.

  Tip: built files are meant to be served over an HTTP server.
  Opening index.html over file:// won't work.

Done in 12.46s.
def buildTools = ["web": "/usr/local/node-v14.16.1-linux-x64"]

pipeline {
	agent { label  "build" }	
    options {
		skipDefaultCheckout true
	}

	stages {
		stage("GetCode"){
			steps{
				script{
					println("下载代码 --> 分支： ${env.branchName}")
 				    checkout([$class: 'GitSCM', branches: [[name: "${env.branchName}"]], extensions: [], userRemoteConfigs: [[credentialsId: '823b86fe-2c1b-466e-b0c3-66ae6991449d', url: "${gitHttpURL}"]]])
				}
			}
			
		}

		stage("Build"){
			steps {
				script {


					sh """
						${buildTools["web"]}/bin/npm install  
						${buildTools["web"]}/bin/npm run build

						"""
				}
			}
		}

	}

	post {
		always {
			script{
				echo "always......"

			}
		}

		success {
			script {
				echo "success....."
			}
		}
	}

}

更多文章推荐

历史上的今天
12月
21
浏览448 评论0
返回
目录 返回
首页
Jenkins 进阶01 共享库share Library封装常用模块 Jenkins 常用的项目构建工具集成 03 GO
↑