Atl3NwYaC

23朵毒蘑菇

node项目打包部署,js,css代码压缩。

node项目部署不能直接部署源码吧,ts写的部署还是打包后的代码呢,项目简单还得五脏俱全。

node打包部署

2023-01-08 17:26:05 已有版本 1 个 show:0.77kTYPE: blog

博客后台部署到服务器上

使用nodejs编写运行,所以像前端那样打包到一个文件里不是很科学,操作文件时文件path不好处理,所以我想的是打包后文件结构不变,只是js,css,压缩混淆一下就行了。

以下是biuld.js源码

/**
 * 项目打包操作
 * 复制除了js的文件
 * js文件进行压缩
 */

const path = require('path');
const fs = require('fs');
const glob = require('glob');
const makeDir = require('make-dir');
const UglifyJS = require("uglify-js");
const copyFile = require('fs-copy-file');
const CleanCSS = require('clean-css');

/** 表示是js文件 */
function isJsFile(path){
    path = path || '';
    const list = path.split('.');
    if(list.length <= 1) return false;
    if(list[list.length-1] === 'js') return true;
    return false;
}
/** 表示是css文件 */
function isCssFile(path){
    path = path || '';
    const list = path.split('.');
    if(list.length <= 1) return false;
    if(list[list.length-1] === 'css') return true;
    return false;
}

console.log('biuld start:----------');
console.time();
process.on('exit',() => {
    console.log("biuld end:----------");
    console.timeEnd();
});
// 遍历文件
glob('**/*', {
    ignore:['node_modules/**','dist/**','biuld.js'],
}, async function (er, files) {
    if(er){
        console.error(er);
        return;
    }
    await makeDir(path.join(__dirname,'.','dist'));
    files.forEach(async (item)=>{
        const path_ = path.join(__dirname,'.',item);
        const path__ = path.join(__dirname,'.','dist',item);
        const isFile = fs.statSync(path_).isFile();  //表示是文件
        if(!isFile){  //表示是目录,建立
            await makeDir(path__);
        }else{
            const isJs = isJsFile(item);
            const isCss = isCssFile(item);
            if(isJs){
                // js文件 代码进行压缩
                const content = fs.readFileSync(path_, "utf8");
                try {
                    const output = UglifyJS.minify(content, {
                        mangle: {
                            toplevel: true,
                        },
                        nameCache: {},
            
                    });
                    fs.writeFileSync(path__, output.code, "utf8");
                    console.log('压缩完成:',item);
                } catch {
                    console.log('压缩失败--:',item);
                }
            }else if(isCss){  //压缩css文件
                const content = fs.readFileSync(path_, "utf8");
                try {
                    const output = new CleanCSS({}).minify(content);
                    fs.writeFileSync(path__, output.styles, "utf8");
                    console.log('压缩完成:',item);
                } catch {
                    console.log('压缩失败--:',item);
                }
            }else{
                copyFile(path_, path__,(err) => {
                    if (err) {
                        console.error('创建失败:',item);
                        return;
                    }
                });
            }
        }
    });
});

代码还是很简单的,就是简单的调用相关库的接口就完事了,那些库很多都是英文的,看也看不懂配置,只是使用了默认的配置就行了。

使用的库看着安装就行了,文档的话在npm官网搜索一下就可以看到使用文档了。

npm官网

结语

java项目部署是jar包,后台项目部署还是不要直接源码放上去运行就完事,node貌似也可以打包成执行文件部署,应该有点麻烦,还是安安分分写个打包脚本来的实在。