时间戳

首页 > 解决方案 > 使用 Gulp 4 导入/捆绑 Bootstrap 5 或 Popper.js 会生成 LICENSE.js 文件？

javascript - 使用 Gulp 4 导入/捆绑 Bootstrap 5 或 Popper.js 会生成 LICENSE.js 文件？

问题描述

我在 Bootstrap 5 项目中使用 Gulp 4 和 Webpack 5，当我捆绑我的脚本时，Gulp 会生成一个bundle.js（如预期的那样），但它也会生成一个bundle.js.LICENSE.js文件。

我在构建任务中看不到任何会创建它的东西。

似乎只有当 Iimport 'bootstrap'或import Popper from 'popper.js/dist/umd/popper'.

有没有办法禁用该许可证文件的生成？我猜 Bootstrap 5 js 中有一些东西迫使 Gulp 或 Webpack 创建该文件（？）

任何想法将不胜感激。这是我的构建脚本任务：

// Build Scripts Task
const buildScripts = (mode) => (done) => {
  let streamMode;
  if (mode === 'development') {
    streamMode = require('./webpack/config.development.js');
  } else if (mode === 'production') {
    streamMode = require('./webpack/config.production.js');
  } else {
    streamMode = undefined;
  }
  
  ['development', 'production'].includes(mode) ? pump([
    gulp.src(srcPath('js')),
    vinylNamed(),
    webpackStream(streamMode, webpack),
    gulpSourcemaps.init({ loadMaps: true }),
    through2.obj(function (file, enc, cb) {
      const isSourceMap = /\.map$/.test(file.path);
      if (!isSourceMap) {
        this.push(file);
      }
      cb();
    }),
    gulpBabel({
      presets: ['@babel/preset-env'],
    }),
    ...((mode === 'production') ? [gulpUglify()] : []),
    gulpSourcemaps.write('./'),
    gulp.dest(distPath('js')),
    browserSync.stream(),
  ], done) : undefined;
};

标签： javascripttwitter-bootstrapgulp

解决方案

Webpack 用于优化文件的插件称为 Terser，它具有将与特定模式匹配的内联注释提取到外部文件的选项（默认情况下是您所看到的许可模式）。

https://webpack.js.org/plugins/terser-webpack-plugin/

module.exports = {
  optimization: {
    minimize: true,
    minimizer: [
      new TerserPlugin({
        terserOptions: {
          //...
          extractComments: true
        },
      }),
    ],
  },
}

默认情况下，使用 /^**!|@preserve|@license|@cc_on/i 正则表达式条件仅提取评论并删除剩余评论。如果原始文件名为 foo.js，则注释将存储到 foo.js.LICENSE.txt。terserOptions.format.comments 选项指定是否保留评论，即可以保留一些评论（例如注释），同时提取其他评论，甚至保留已提取的评论。

签入你的config.production.jswebpack 文件，看看那里是否使用了这些选项。它确实默认为true。

推荐阅读