如何解决webpack + babel:如何只在一个入口点中包含 polyfils 但使它们“全局”以便其他入口点可以工作
我的 webpack 构建适用于多个入口点,因为我想提供一个 AMD 库,它具有各种独立的模块。任何时候都只会首先加载这些模块中的一个(我们称之为 core.js)。 Babel/Corejs3 将它的 polyfill 添加到每个入口点,使我的包比需要的要大得多。我希望 polyfill 仅在“core.js”中定义,但使它们“全局”(添加到 window 对象)。
我需要如何采用我的 .babelrc 或 webpack.config.js 来实现这一点?
我的 webpack.config 是动态构建的(入口点是动态添加的),这是一个只有几个入口点的示例,以保持简单,但它包含更多入口点。
const TerserPlugin = require('terser-webpack-plugin');
module.exports = {
"entry": {
"core": {
"import": "./core.js"
},"gallery": {
"import": "./gallery.js"
},"utils": {
"import": "./utils.js"
},},"output": {
"devtoolNamespace": "http://","library": {
"name": "[name]","type": "amd"
},"path": "/path/to/libraryroot"
},"devtool": "source-map","module": {
"rules": [
{
"test": /\.js$/,"loader": "babel-loader"
}
]
},"optimization": {
"minimizer": [
new TerserPlugin({
extractComments: true,})
]
},"externals": {
"core": {
"amd": "core"
},"gallery": {
"amd": "gallery"
},"utils": {
"amd": "utils"
},"resolve": {
"modules": [
__dirname,'node_modules',]
},"mode": "development","amd": {
"jQuery": true
},"context": "/path/to/src"
};
这是我的 .babelrc
{
"presets": [
[
"@babel/preset-env",{
"debug": true,"useBuiltIns": "usage","corejs": 3
}
],"@babel/preset-flow"
],"plugins": [
["@babel/plugin-transform-react-jsx",{ "pragma":"h" }]
]
}
如果所有 polyfill 都在一个额外的 js 文件中,那就更好了,该文件可以包含在文档标题中。
最好的结果是 - 当然是 - 如果所有 polyfil 都可以作为 amd deps 加载并添加到结果中的定义语句中。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。