Я пытаюсь оптимизировать связку поставщиков, созданную веб-пакетом, для нескольких пользовательских блоков. Проблема в том, что после сборки и создания чанков мое приложение реакции не загружается. Я пробовал другой порядок сценариев также ... Если я запускаю приложение с поставщиками и основным комплектом, он работает хорошо.
tsconfig
{
"version": "3.2",
"compileOnSave": true,
"compilerOptions": {
"noImplicitAny": true,
"moduleResolution": "node",
"sourceMap": true,
"module": "commonjs",
"target": "es2015",
"jsx": "react",
"preserveConstEnums": true,
"allowSyntheticDefaultImports": true
}
}
webpack.config
module.exports = {
entry: {
bundle: ['@babel/polyfill', './App/myapp.tsx']
},
output: {
filename: "[name].js",
path: __dirname + "/appscripts"
},
module: {
rules: [
{
test: /\.(js|tsx|ts)$/,
exclude: /(node_modules)/,
use: {
loader: 'babel-loader',
options: {
presets: [
'@babel/preset-typescript',
'@babel/preset-env',
'@babel/preset-react'
],
plugins: [
[
"@babel/plugin-transform-regenerator", { "asyncGenerators": false, "generators": false, "async": false }
],
[
"@babel/plugin-proposal-class-properties"
]
]
}
}
}
]
},
resolve: {
extensions: ['.js', '.jsx', '.ts', '.tsx']
},
optimization: {
runtimeChunk: 'single',
splitChunks: {
chunks: 'all',
maxInitialRequests: Infinity,
minSize: 0,
cacheGroups: {
reactVendor: {
test: /([\\/]node_modules[\\/](react|react-dom)[\\/])/,
name: "react~bundle"
}
}
}
}
};
В моем html я поместил скрипты в тег src, такие как vendors ~ bundle, реагировать ~ bundle, bundle.
Я перепробовал несколько плагинов, прочитал десятки статей ... Babel, необходима поддержка IE 11.
Можно ли сделать такое разделение?