Как я могу создать файл конфигурации для реагирования и предотвращения его связывания с веб-пакетом?

Question

Я добавил config.json в приложение.

в webpack.config.js я определил Config

externals: {
    'Config': JSON.stringify(production ? require('./config.prod.json') : require('./config.dev.json'))
},

в приложении я потребовал конфиг и использовал его

var Config = require('Config');

Однако, webpack связывает мой конфигурационный файл в index.js(мой выходной файл webpack), и я этого не хочу. Я хочу сохранить мой config.json отдельно от index.js. Для этого я исключил свой config.json, но он не работал.

exclude: [/node_modules/, path.resolve(__dirname, 'config.dev.json'), path.resolve(__dirname, 'config.prod.json')]

Можете ли вы помочь мне, если я что-то упустил. Спасибо

Answer 1

Как описано в @thedude, вы можете использовать функцию разделения кода в веб-пакете. Вместо того, чтобы просто делать import config from 'config.json' Вы можете использовать действительно классную функцию разделения кода.

require.ensure([], function(require) {
  let _config = require("config.json");
  this.setState({
    _configData: _config
  });
});

и когда вы хотите использовать данные config, сделать это, проверив состояние

if(this.state._configData) { // this checks _configData is not undefined as well
  // use the data of config json
}

Когда вы скомпилируете свой код с помощью веб-пакета, будут созданы два файла пакета, т.е. bundle.js а также 0.bundle.js, это 0.bundle.js имеет ваш код config.json файл.

Answer 2

Вы должны использовать функцию разделения кода в веб-пакете: https://webpack.js.org/guides/code-splitting/