webpack - 删除"webpackBootstrap"代码

Question

我正在使用WebPack来连接js文件并输出到dist文件夹.所有这一切似乎都有效,但我的问题是我想连接所有的js文件而没有额外的webpack boostrap代码

/******/ (function(modules) { // (/******/ (function(modules) { // webpackBootstrap)......

反正是为了阻止webpack添加该代码,而只是采用普通的js文件并连接它们(如gulp-concat).

Answer 1

假设您使用的是 Webpack 4，将 runtimeChunk 放到配置文件中，这样 Webpack 将生成一个运行时 .js 文件，其中只包含 webpackBootstrap 部分，让您的输出文件保持干净：

optimization: {
    runtimeChunk: true,
}

Answer 2

可以使用webpack-merge-and-include-globally。

webpack.config.js

const path = require('path');
const MergeIntoSingleFilePlugin = require('webpack-merge-and-include-globally');

module.exports = {
  entry: './src/index.js',
  output: {
    filename: '[name]',
    path: path.resolve(__dirname, 'dist'),
  },
  plugins: [
    new MergeIntoSingleFilePlugin({
      "bundle.js": [
        path.resolve(__dirname, 'src/util.js'),
        path.resolve(__dirname, 'src/index.js')
      ],
      "bundle.css": [
        path.resolve(__dirname, 'src/css/main.css'),
        path.resolve(__dirname, 'src/css/local.css')
      ]
    })
  ]
};

https://code.luasoftware.com/tutorials/webpack/merge-multiple-javascript-into-single-file-for-global-scope/#webpack-merge-and-include-globally