防止 JS 文件分裂成块（vue cli 4 + webpack）

Question

npm run build

正在创建多个“块”文件，例如：

1. /dist/js/app.*.js
2. /dist/js/chunk-2413.js
3. /dist/js/chunk-5133.js

我的目标是将它们全部放在一个 app.*.js 文件中！

我在 vue.config.js 中将 'splitChunks' 设置为 false，但是这不会将所有块放在同一个 app.*.js 文件中，因为我将一堆文本文件导入到项目（我选择文本文件而不是内部配置变量，因为我更喜欢这种格式用于应用程序的目的）。

这是我成功返回承诺并将文本文件中的数据加载到 allContents 数组中的代码：

const textFiles = require.context('../assets/textfiles', true, /\.txt$/i);
var self = this;    
var fileContents = textFiles .keys();
fileContents.forEach(function (item, index){
    console.log(item+' - '+index);
    var val = import('raw-loader!../assets/textFiles '+item.replace('.',''));
    val.then( (resp) => {
        console.log(resp.default);
        self.allContents.push(resp.default);
    });
});

这些文本文件中的数据导致创建“dist/js/chunk...”文件。我需要做的是阻止他们这样做——但是怎么做呢？有没有办法阻止这种行为？

更新以包含 vue.config.js：

const ScriptExtHtmlWebpackPlugin = require('script-ext-html-webpack-plugin')

module.exports = {
    publicPath: '',
    productionSourceMap: false,
    css: {
        extract: false,
    },
    configureWebpack: {
        optimization: {
            splitChunks: false
        },
        plugins: [
            new ScriptExtHtmlWebpackPlugin({
                preload: /\.js$/,
                defaultAttribute: 'async'
            })
        ]       
    },
    chainWebpack: config => {
        config.module
          .rule('raw')
          .test(/\.txt$/)
          .use('raw-loader')
          .loader('raw-loader')
          .end()
  }
}

来自其中一个块 js 文件的样本数据： （它只是加载到一个 txt 文件中，该文件的内容类似于 '### Config: ### blah blah'）

(window["webpackJsonp"]=window["webpackJsonp"]||[]).push([["chunk-2d0a2dc4"],{"005c":function(e,t,n){"use strict";n.r(t),t["default"]="export default \"##########\\r\\n# Config:\\r\\n##########\\r\\n\\r\\n$type: Chat\";"}}]);

Answer 1

使用带有“import”语法的 raw-loader 是使其自动拆分的原因。而你代码中textFiles的路径最后有一个空格，我不知道是不是错字

var val = import('raw-loader!../assets/textFiles '+item.replace('.',''));

您可以尝试更改为这种方式。它可能有助于作为一种解决方法来防止分裂

fileContents.forEach(function (item, index) {
  console.log(item + ' - ' + index)
  var val = require('raw-loader!./assets/textFiles' + item.replace('.', ''))
  self.allContents.push(val.default)
})

希望有帮助