搭建前台自动化上传
一、服务器文件上传有以下几种方式
1、grunt-scp www.npmjs.com/package/gru…
这个插件需要Grunt >=0.4.5
2、grunt-ssh www.npmjs.com/package/gru… 推荐使用该方式
这个库为ssh提供了两个简单的任务
- sftp
- sshexec
注意： agent: process.env.SSH_AUTH_SOCK 用于基于ssh代理的用户身份验证的ssh-agent的UNIX套接字的路径。
grunt-ssh这个插件是为Grunt 0.4.x设计的。如果您仍然在使用grunt v0.3。强烈建议您升级，但如果您不能使用v0.1.0。
1.1 ssh-agent使用：
-D：删除ssh-agent中的所有密钥.
-d：从ssh-agent中的删除密钥
-e pkcs11：删除PKCS#11共享库pkcs1提供的钥匙。
-s pkcs11：添加PKCS#11共享库pkcs1提供的钥匙。
-L：显示ssh-agent中的公钥
-l：显示ssh-agent中的密钥
-t life：对加载的密钥设置超时时间，超时ssh-agent将自动卸载密钥
-X：对ssh-agent进行解锁
-x：对ssh-agent进行加锁
# 示例: process.env.SSH_AUTH_SOCK 值设置
# 启动ssh-agent进程
eval `ssh-agent`
# 把专用密钥添加到 ssh-agent 的高速缓存中：
ssh-add ~/.ssh/id_dsa
#从ssh-agent中删除密钥：
ssh-add -d ~/.ssh/id_xxx.pub
#查看ssh-agent中的密钥：
ssh-add -l
# 关闭ssh-agent进程
ssh-agent -k
如果服务器上面/root/.ssh/authorized_keys没有加入本地私钥id_rsa，,则会报错误
报错： Running "sshexec:test" (sshexec) task
Warning: Connection :: error :: Error: All configured authentication methods failed Use --force to continue.
解决方案：
在服务器上/root/.ssh/authorized_keys添加私钥，注意.ssh文件是不可见的
把自己的私钥添加进去即可
3、grunt-rsync www.npmjs.com/package/gru…
用于访问rsync命令行实用程序的文件复制和同步功能的Grunt多任务。
注意： rsync是Linux和Mac自带的命令，Windows就有点坑爹了。Windows上的解决办法有几种： 1、安装cygwin 2、安装cwRsync Win10 3、开启Linux子系统
Rsync和scp的区别：
当文件数据很大时候：
scp 无法备份大量数据， 特点： 先统一信息，像windows复制。scp每次拷贝都是完整拷贝。无法增量拷贝。
rsync 边复制，边比较，边统计。
二、前端文件压缩方式
1、css压缩 www.npmjs.com/package/gru…
grunt-contrib-cssmin
2、html压缩 www.npmjs.com/package/gru…
grunt-contrib-htmlmin
3、图片压缩 www.npmjs.com/package/gru…
grunt-contrib-imagemin
4、js 压缩 www.npmjs.com/package/gru…
grunt-contrib-uglify
module.exports = function(grunt) {
// Project configuration.grunt.initConfig({pkg: grunt.file.readJSON('package.json'),uglify: {options: {banner: '/*! <%= pkg.name %> <%= grunt.template.today("yyyy-mm-dd") %> */\n',mangle: false, // 不混淆变量名preserveComments: 'false', // 不删除注释，还可以为 false（删除全部注释），some（保留@preserve @license @cc_on等注释）footer:'\n/*! <%= pkg.name %> 最后修改于： <%= grunt.template.today("yyyy-mm-dd") %> */'//添加footer},buildall: {// 按原文件结构压缩js文件夹内所有JS文件files: [{expand:true,cwd:'../fishing/scripts', // js目录下src:'**/*.js', // 所有js文件dest: './dest/scripts'// 输出到此目录下}]},},// 压缩CSScssmin:{buildall:{options:{mangle:false},expand: true,cwd: '../fishing/css', //压缩那个文件夹里的文件src:'**/*.css', // 压缩那个文件dest:'./dest', // 放压缩后文件的文件夹ext:'.css', // 压缩后文件的的名字},buildScriptall:{options:{mangle:false},expand: true,cwd: '../fishing/scripts', //压缩那个文件夹里的文件src:'**/*.css', // 压缩那个文件dest:'./dest/scripts', // 放压缩后文件的文件夹ext:'.css', // 压缩后文件的的名字}},// 压缩CSShtmlmin:{buildall:{options:{removeComments: true, //移除注释collapseWhitespace: true,//无用空格},expand: true,cwd: '../fishing/page', //压缩那个文件夹里的文件src:'**/*.html', // 压缩那个文件dest:'./dest/page', // 放压缩后文件的文件夹ext:'.html', // 压缩后文件的的名字}},imagemin: {dist: {options: {optimizationLevel: 3 //定义 PNG 图片优化水平},files: [{expand: true,cwd: '../fishing/image', // 图片在imagemin目录下src: ['**/*.{png,jpg,jpeg}'], // 优化 imagemin 目录下所有 png/jpg/jpeg 图片dest: 'dest/image/' // 优化后的图片保存位置，覆盖旧图片，并且不作提示}]}},clean: {dest: ['dest'],release: ['build']},sshconfig: {fishing: {host: '<%= secret.host %>',username: '<%= secret.username %>',agent: process.env.SSH_AUTH_SOCK, // 用于基于ssh代理的用户身份验证的ssh-agent的UNIX套接字的路径}},rsync: {options: {args: [ "--verbose", "--progress" ],recursive: true},
server: {options: {src: [ "../fishing/" ],dest: "/www/wwwRoot/<%= pkg.name %>",exclude: [ "node_modules", "app", "runtime", ".DS_Store", "test", ".gitignore", ".eslintrc", ".gitkeep" ],ssh: true,host: "root@serverIp", // serverIp 服务器ipdelete: true,config: 'fishing'}}},// grunt-scp 文件上传scp: {options: {host: '<%= secret.host %>',username: '<%= secret.username %>',passphrase: '<%= secret.password %>'},your_target: {files: [{cwd: '../fishing',src: '**/*',filter: 'isFile',// path on the serverdest: '/www/wwwRoot/<%= pkg.name %>'}]},},// grunt-ssh 文件上传secret: grunt.file.readJSON('secret.json'),sftp: {test: {files: {"./": "../fishing/**"},options: {path: '/www/wwwRoot/<%= pkg.name %>', // 远程服务器上的路径。默认为/config: 'fishing',// srcBasePath: "../", // 在执行SFTP操作时，可以去掉文件的初始部分。 这是一个字符串操作，所以尾部斜杠很重要。showProgress: false,createDirectories: true // 选择是否首先存在目录文件的sftp。 这可以能需要一些额外的时间，因为需要检查目录，因这里默认情况下禁用这里选项。}}},sshexec: {test: {command: 'uptime',options: {config: 'fishing',}},syncdir: {command: "mkdir -p " + '/www/wwwRoot/<%= pkg.name %>/server',options: {config: "fishing"}}}});
// 加载包含 "uglify" 任务的插件。grunt.loadNpmTasks('grunt-contrib-uglify');
grunt.loadNpmTasks('grunt-contrib-cssmin');
grunt.loadNpmTasks('grunt-contrib-htmlmin');
grunt.loadNpmTasks('grunt-contrib-imagemin');
grunt.loadNpmTasks('grunt-contrib-clean');
// rsync是Linux和Mac自带的命令，Windows就有点坑爹了。Windows上的解决办法有几种： 安装cygwin 安装cwRsync Win10开启Linux子系统//grunt-rsync 用于访问rsync命令行实用程序的文件复制和同步功能的Grunt多任务。grunt.loadNpmTasks('grunt-rsync');grunt.loadNpmTasks('grunt-scp');grunt.loadNpmTasks('grunt-ssh');
// 默认被执行的任务列表。grunt.registerTask('build', 'build project', function(data) {grunt.log.writeln('正在打包中...');grunt.task.run([ 'clean', 'cssmin', 'uglify', 'cssmin', 'htmlmin', 'imagemin']);});
// 同步文件选择 1、scp 2、 sftp 推荐使用这种方式// 执行命令grunt sync:scp grunt sync:sftpgrunt.registerTask('sync', 'build project', function(data) {grunt.log.writeln('正在上传中...');grunt.task.run(['sshexec']);grunt.task.run([data]);});};};
package
{"name": "fishing","version": "1.0.0","description": "","main": "index.js","scripts": {"test": "echo \"Error: no test specified\" && exit 1"},"author": "","license": "ISC","devDependencies": {"grunt": "^1.0.4","grunt-contrib-clean": "^2.0.0","grunt-contrib-concat": "^1.0.1","grunt-contrib-copy": "^1.0.0","grunt-contrib-cssmin": "^3.0.0","grunt-contrib-htmlmin": "^3.1.0","grunt-contrib-imagemin": "^3.1.0","grunt-contrib-jshint": "^2.1.0","grunt-contrib-uglify": "^4.0.1","grunt-contrib-watch": "^1.1.0","grunt-exec": "^3.0.0","grunt-ftp": "^2.1.0","grunt-rsync": "^3.0.0","grunt-ssh": "^0.12.9"},"dependencies": {"grunt-scp": "^0.1.11"}}