我使用的是 webpack 4.*
捆绑我的 react 16.*
和 typescript 3.*
项目!在我们心爱的internet explorer 11上,我得到。不响应长期运行的脚本错误 项目永远不会加载......无论在本地还是测试服务器(生产模式)。
我找不到哪边的项目是不支持IE11的,因为它没有给我那么多信息,我在网上也找不到类似的东西......下面是它的样子。
和我的相关设置是。
webpack.base.js
module.exports = {
entry: {
app: path.resolve(__dirname, "./src/index.tsx"),
},
output: {
path: path.resolve(__dirname, "./build/dist"),
publicPath: "public",
},
resolve: {
extensions: [".ts", ".tsx", ".js", ".json", ".sass"],
alias: {
// .... some internal aliases
},
},
module: {
rules: [
{
enforce: "pre",
test: /\.(ts|tsx)$/,
exclude: /node_modules/,
loader: "eslint-loader",
},
{
test: /\.(ts|tsx)?$/,
exclude: /node_modules/,
loader: "ts-loader",
},
{
test: /\.(gif|jpg|jpeg|svg|png|webp|eot|otf|ttf|woff|woff2|mp4|ogg|webm)$/i,
loader: "url-loader",
options: {
limit: 1,
name: "[name].[hash:8].[ext]",
},
},
],
},
optimization: {
runtimeChunk: "single",
splitChunks: {
chunks: "all",
cacheGroups: {
vendor: {
test: /[\\/]node_modules[\\/]/,
chunks: "initial",
name: "vendor",
enforce: true,
},
},
},
},
plugins: [
new webpack.DefinePlugin({
// ...
}),
new HtmlWebpackPlugin({
template: "src/index.ejs",
hash: true,
// ... some internal values to be injected to the template, like gtm and etc
}),
],
}
tsconfig.json
"compilerOptions": {
"module": "esnext",
"target": "es5",
"lib": ["dom", "dom.iterable", "esnext"],
"esModuleInterop": true,
"jsx": "react",
"moduleResolution": "node",
...
}
index.tsx
import "react-app-polyfill/ie11";
import "react-app-polyfill/stable";
import React from "react";
...
我想这可能更多的是跟我的代码有关,而不是第三方的lib...... 我没有使用jQuery,同样的代码也能正常使用。nwb! 我刚刚把bundler改成了webpack,并且把npm包更新到了最新的版本
如果需要更多的信息,我可以通过帖子更新分享给大家
这个问题是一个巨大的内存泄漏,不知何故造成的。[email protected]!
由于它只用在两个地方,我把它的包扔了,换成了内置的 RegExp
现在一切都好了!
我最初的错误是,我太过依赖 Network
标签! Performance
在DevTool中的部分是更有效和有用的方式