我正在一个React项目上工作,该项目是使用create-react-app构建的,后来我们进行了eject并大量修改了webpack配置。现在我很难从外部库中导入
我已经尝试使用
问题在于构建成功,但我遇到了所有const enums导入时的运行时问题,如下所示:
const enums
。我无法控制那个外部包。它在其d.ts
文件中定义了const枚举。我已经尝试使用
babel-plugin-use-const-enum
Babel插件和预设集,但也没有帮助我。
我的Webpack配置:
.....
.....
{
test: /\.(js|mjs|jsx|ts|tsx)$/,
include: [paths.appSrc],
loader: require.resolve("babel-loader"),
options: {
customize: require.resolve("babel-preset-react-app/webpack-overrides"),
plugins: [
[require.resolve("babel-plugin-const-enum"), { transform: "constObject" }],
[require.resolve("@babel/plugin-transform-typescript"), { isTSX: true, optimizeConstEnums: true }],
[require.resolve("@babel/plugin-transform-react-jsx")],
[require.resolve("@babel/plugin-proposal-class-properties"), { loose: true }],
[require.resolve("@babel/plugin-proposal-nullish-coalescing-operator")],
[require.resolve("@babel/plugin-proposal-optional-chaining"), { isTSX: true }],
[require.resolve("@babel/plugin-transform-arrow-functions")],
[require.resolve("@babel/plugin-proposal-private-methods"), { loose: true }],
[
require.resolve("babel-plugin-named-asset-import"),
{
loaderMap: {
svg: {
ReactComponent: "@svgr/webpack?-svgo,+titleProp,+ref![path]",
},
},
},
],
],
presets: ["@babel/preset-env"],
},
},
.....
.....
我的tsconfig文件:
{
"compilerOptions": {
"typeRoots": ["./typings", "node_modules/@types"],
"target": "es5",
"lib": ["dom", "dom.iterable", "esnext"],
"allowJs": true,
"skipLibCheck": true,
"esModuleInterop": true,
"allowSyntheticDefaultImports": true,
"strict": true,
"forceConsistentCasingInFileNames": true,
"module": "esnext",
"moduleResolution": "node",
"resolveJsonModule": true,
"noEmit": true,
"jsx": "react",
"downlevelIteration": true
},
"exclude": ["dist/**/*"],
}
问题在于构建成功,但我遇到了所有const enums导入时的运行时问题,如下所示:
Uncaught TypeError: Cannot read properties of undefined (reading '<ConstEnumName>')
。
包版本:
"@babel/core": "^7.11.6",
"babel-loader": "^8.1.0",
"typescript": "^3.9.7",
"webpack": "^4.44.2",