1

我正在尝试在 AngularJS 应用程序中渲染使用 tsx 构建的 React 组件。我的 AngularJS 应用程序使用 babel 和 webpack 4。同时,库构建包括require('react/jsx-runtime'),这可能是问题的一部分, 但需要

这是我的 .babelrc 文件:

{
    "presets": [
        "@babel/preset-env",
        "@babel/preset-react"
    ],
    "plugins": [
        "@babel/plugin-proposal-object-rest-spread",
        ["@babel/plugin-transform-react-jsx", {
            "runtime": "automatic"
        }]
    ]
}

这是我的 package.json

  "devDependencies": {
    "@babel/core": "^7.15.0",
    "@babel/plugin-proposal-object-rest-spread": "^7.14.7",
    "@babel/plugin-transform-react-jsx": "^7.14.9",
    "@babel/preset-env": "^7.15.0",
    "@babel/preset-react": "^7.14.5",
    "@babel/preset-typescript": "^7.15.0",
    "babel-loader": "^8.2.2",
    "babel-preset-env": "1.6.0",

最后,我的 webpack 配置包括以下规则:

      {
        test: /\.(js|jsx)$/,
        use: 'babel-loader',
        exclude: /node_modules/
      },
      {
        test: /\.(ts|tsx)$/,
        exclude: ['/node_modules/'],
        use: {
          loader: 'babel-loader',
          options: {
            presets: ['@babel/preset-env', '@babel/preset-typescript']
          }
        }
      },

任何形式的帮助将不胜感激

4

0 回答 0