背景
最近自己用nodercms搭建了一个简单的博客系统,用户发布一些自己谁便谢谢的文章。感谢nodercms团队,这个cms轻量易用,用于做个人博客太方便了。
开发了博客系统,肯定设计到部署到AWS或者阿里云等服务器上,那么,打包脚本就是必须的,这里,我自己修改了原有的gulp脚本,添加了打包脚本,实现了一键编译打包。这里就简单的介绍一下。
源文件地址
https://gitlab.com/BowenHBX/nodercms-build-deploy
依赖
"del": "^2.2.0", "gulp": "^3.8.11", "gulp-angular-templatecache": "^1.8.0", "gulp-autoprefixer": "^3.1.0", "gulp-clean-css": "^2.0.6", "gulp-concat": "^2.5.2", "gulp-less": "^3.0.5", "gulp-plumber": "^1.0.0", "gulp-uglify": "^1.5.2", "gulp-util": "^3.0.7", "shelljs": "^0.7.8", "run-sequence": "^2.0.0",
完善gulp脚本
其实nodercms团队的gulp编译脚本已经很完善了,我这里只是提取有用的文件并复制到一个临时文件夹下
/** * 拷贝编译好的资源 */ gulp.task('copy_other_files', function() { gulp.src([ './bin/**', './config/**', './core/**/*', './lib/**', './install.lock', './*.js', './*.json', './public/*.*', './public/assets/**', './public/themes/**', './README.md', '!./config/database.config.js' ], { base: './' }) .pipe(gulp.dest('tmp')) });
简单说明:
./bin/** : nodercms启动文件存放目录
./config/** : 所有配置文件
!./config/database.config.js : 排除数据库配置,避免覆盖生产环境的数据库配置
其他的目录为node文件和资源模板文件
以上copy_other_files任务会将所有网站运行的必要文件复制到根目录的/tmp/文件加下
添加清除脚本
每次构建前我们都希望tmp文件是空的,避免有多余的旧文件保留
/** * 清除 tmp */ gulp.task('cleanTmp', function(cb) { return del(['./tmp'], cb); });
修改build任务
/** * 生产模式编译 */ gulp.task('build', cb => runSequence( 'cleanTmp', [ 'build-admin-assets-less', 'concat-vendor-js-less', 'concat-vendor-css-less', 'concat-admin-js-less', 'concat-admin-views', 'copy-admin-assets', 'copy-admin-font-awersome-fonts', ], 'copy_other_files', cb ) );
这里使用了“run-sequence”插件,该插件是为了让任务同步执行:
- 清除tmp文件夹
- 编译文件
- 复制所有文件到tmp文件夹
到这里整个网站执行需要的文件就都在tmp文件夹下面了,接下来就是打包的工作
打包
在根目录添加文件夹build,在build中添加两个文件:deploy.js, deploy.sh,如下:
build.js文件如下:
const shell = require('shelljs'); const path = require('path'); const pkgInfo = require('../package.json'); (function() { const appName = pkgInfo.name; const version = pkgInfo.version; console.log(`deploy app name: ${appName}`); // 版本号合法检查 if (!version) { console.log('not ci tag or not params, don\'t pack!!!'); return; } // 进行打包 deploy(`${appName}-${version}`); // 调用发布shell function deploy(fileName) { shell.exec(`sh ../build/deploy.sh ${fileName}`, { cwd: path.resolve(__dirname, '../tmp/'), async: true }); } }());
代码很简单:
- 使用${appName}-${version}组成包的文件名
- 使用shell执行deploy.sh脚本,将/tmp/目录里面的文件打包成${fileName}
shell脚本,deploy.sh的代码如下:
#!/usr/bin/env bash PACK_NAME="$1.tgz" echo ">>> Installing prod dependencies..." npm i --production echo "<<<" echo "" echo ">>> Packing..." touch $PACK_NAME; mkdir logs cd logs mkdir access && mkdir database && mkdir errors && mkdir system cd ../ tar -czf ./$PACK_NAME --exclude=$PACK_NAME . echo "Package: $PACK_NAME" echo "<<<" echo "" echo ">>> Show Package's Size..." ls -lh echo "<<<" echo "" echo ">>> copy file" cd ../ mkdir pack mv tmp/$PACK_NAME pack/ echo "<<<" echo ""
这一部分的脚本也很好理解:
- 文件名为deploy.js里面的fileName加上".tgz"
- 创建文件夹logs,并且创建子目录access,database,errors,system(这一步很重要,不然启动的时候可能报权限错误,当然可以使用chmod 777 xxx来修改站点目录权限)
- 打包文件
- 输出文件大小
- 将打包的文件复制到/pack/文件夹下
修改package.json文件scripts配置
"scripts": { "start": "node ./bin/www &", "build:dev": "gulp default", "build:prod": "gulp build", "deploy:prod": "gulp build && node build/deploy.js prod" }
当执行deploy:prod后,一个*.tgz文件就生成了,在/pack/目录下;
上传文件到服务器,解压,进入更目录,执行以下脚本nodercms就启动了
$ npm start
到此,这个简单的构建脚本介绍就结束啦!
尊重知识产权,转载请说明出处!