我在汇总中使用svelte。我需要支持IE11
我当前在rollup.config.js中的babel配置是:
babel({
extensions: [ '.js', '.mjs', '.html', '.svelte' ],
exclude: 'node_modules/**',
presets: [
[
'@babel/env',
{
modules: 'false',
targets: {
browsers: '> 1%, IE 11, not op_mini all, not dead',
node: 8
},
useBuiltIns: 'usage'
}
]
]
}),
请帮助我进行配置,现在我的应用程序在IE和其他浏览器(Chrome,Mozilla)上均同时中断。
最佳答案
您可以将Babel插件的配置用作in Sapper作为参考:
babel({
extensions: ['.js', '.mjs', '.html', '.svelte'],
runtimeHelpers: true,
exclude: ['node_modules/@babel/**'], // <= /!\ NOT 'node_mobules/**'
presets: [
['@babel/preset-env', {
// adapter to ensure IE 11 support
targets: '> 0.25%, not dead, IE 11'
}]
],
plugins: [
'@babel/plugin-syntax-dynamic-import',
['@babel/plugin-transform-runtime', {
useESModules: true
}]
]
}),
要注意的重要一点是,您不能将整个
node_modules
排除在Babel的处理之外。原因是Svelte的代码本身(即在node_modules/svelte
下)需要进行转译以支持IE 11。同样,如果您使用第三方Svelte组件,它们可能会存在于node_modules
下,但需要进行编译。要知道的另一个棘手的问题是,转码后的代码不能与非转码后的代码兼容。特别是,ES6 +类(用于Svelte组件)与其ES5转换的对应类不兼容(“不能从非类扩展yada yada ...”)。因此,您必须确保所有Svelte代码都使用相同的规则进行了转译,或者根本没有进行转译...
这是another example,它在原始Svelte(即,非Sapper)项目中使用(几乎)相同的配置。
这两个链接都指向模板项目,因此您可以轻松地克隆和运行它们来自己尝试。 (如果要使用第二个示例,请注意,我的链接未指向master分支,因此您必须签出正确的分支才能尝试babel配置。)
关于javascript - 与Babel一起使用IE11,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/59351708/