index.js:1 ./node_modules/@reduxjs/toolkit/dist/redux-toolkit.legacy-esm.js 331:12 模块解析失败:意外的标记 (331:12) 文件是用这些加载器处理的:
if (cache?.has(value)) 返回 false; | const 条目 = getEntries!= null ? getEntries(值) : Object.entries(值); | const hasIgnoredPaths =ignorePaths.length > 0;
有人说更新“@types/react”:“18.2.46”,但这个答案有不好的评论。请帮忙解决问题。以下是我的 package.json 文件,以防与 redux 工具包出现任何兼容性错误
{
"name": "in",
"version": "0.1.0",
"private": true,
"dependencies": {
"@reduxjs/toolkit": "^2.0.1",
"@testing-library/jest-dom": "^5.11.5",
"@testing-library/react": "^11.1.0",
"@testing-library/user-event": "^12.1.10",
"react": "^17.0.1",
"react-dom": "^17.0.1",
"react-redux": "^9.1.0",
"react-router-dom": "^5.2.0",
"react-scripts": "4.0.0",
"redux": "^5.0.1",
"web-vitals": "^2.1.4"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
"eslintConfig": {
"extends": [
"react-app",
"react-app/jest"
]
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
}
}
我已经在这里工作了,通过将 babel-loader 注入到 webpack 配置中:
安装 babel loader 和插件/要求(注意:版本 >=9 对我当前的 SPFX 1.18.2 不起作用)
npm i [email protected] --save-dev
npm i @babel/preset-env --save-dev
npm i @babel/plugin-proposal-optional-chaining --save-dev
npm i core-js@3 --save
然后在你的 gulpfile.js 中:
build.configureWebpack.mergeConfig({
additionalConfiguration: (generatedConfiguration) => {
generatedConfiguration.module.rules.push({
test: /\.js$/,
include: /@reduxjs/,
use: [
{
loader: 'babel-loader',
options: {
presets: [
["@babel/preset-env", {"modules": false, "useBuiltIns": "usage", "corejs": 3}],
],
plugins: [
"@babel/plugin-transform-optional-chaining",
"@babel/plugin-transform-nullish-coalescing-operator"
],
cacheDirectory: true
}
}
]
});
// console.log({rules: generatedConfiguration.module.rules});
return generatedConfiguration;
}
});