项目打包后，样式每次被随机拆分成很多份。如何自动引入全部样式（html自动引入样式）

最近项目开始打包。在打包后app.css会拆解成很多份随机名字的css小包。vue页面的样式是正常的。但是项目里面有一个单独的html页面，页面内又有用到app.css里的一个ui库。这就导致每次打包要把样式重新导入一份，最重要的是 每次名字还不一样，约有十来个。所以就写了一个程序自动导入这些包

包如下图：每次名字都还不一样。

 该程序是在打包后运行的。所以要在package.json里面添加一个打包后的执行程序

"build-prod": "node ./build/prod.js && node ./static/packcss.js"

packcss.js就是要执行的文件

const fs = require("fs");
// ./www是打包后生成的文件名
fs.readdir("./www", (err, files) => {
  files.forEach((data) => {
    let idx = data.lastIndexOf(".");
    let ext = data.substr(idx + 1);
    if (ext === "css") {
    // ‘./www/static/sidebar/all.css’  是需要写入的css文件夹
    //@import '../../" + data + "' 是需要写入上面那个all.css文件夹的内容
      fs.appendFileSync( "./www/static/sidebar/all.css", "@import '../../" + data + "';",
        function (err) {}
      );
    }
  });
});

存放html的文件

这样打包后，那些css样式会以 @import 的形式写入到all.css里了