Question

我们正在尝试将一个独立的应用程序添加到基于reactjs的主应用程序中，该应用程序应在通过服务器提供服务时包含在我们客户的网页中。为了易于使用和减小文件大小，我们希望使用预言。

虽然每个应用程序都在自行编译，但是在我的webpack中将它们都声明为入口文件时，我却得到了包括以下错误的堆栈跟踪：

来自preact项目：

    [tsl] ERROR in /home/user/workspace/project/ui-ticker/tickerV2.tsx(7,8)
      TS2605: JSX element type 'RootNode' is not a constructor function for JSX elements.
  Property 'refs' is missing in type 'RootNode'.

ERROR in /home/user/workspace/project/ui-ticker/tickerV2.tsx
[tsl] ERROR in /home/user/workspace/project/ui-ticker/tickerV2.tsx(7,9)
      TS2686: 'React' refers to a UMD global, but the current file is a module. Consider adding an import instead.

来自react项目：

ERROR in /home/user/workspace/project/ui/app.tsx          
[tsl] ERROR in /home/user/workspace/project/ui/app.tsx(10,5
)                                                                       
      TS2605: JSX element type 'ReactElement<any>' is not a constructor f
unction for JSX elements.

我具有以下文件夹结构：

- project
  - tsconfig.json
  - ui (react-app)
    - tsconfig.json
  - ui-ticker (preact-app)
    - tsconfig.json

tsconfig for preact看起来像这样：

{
  "compilerOptions": {
    "experimentalDecorators": true,
    "allowSyntheticDefaultImports": true,
    "removeComments": true,
    "emitDecoratorMetadata": true,
    "noImplicitAny": false,
    "noImplicitReturns": false,
    "noImplicitThis": false,
    "strictNullChecks": false,
    "noUnusedLocals": false,
    "jsx": "react",
    "jsxFactory": "h",
  },
  "include": [
    "./*.ts",
    "./*.tsx"
  ],
  "exclude": [
    "../node_modules/",
    "../ui/"
  ]
}

react应用看起来几乎一样。两种应用程序似乎都以某种方式访问了错误的类型声明。有没有办法完全隔离两个应用程序之间的依赖关系，同时将它们都保留在同一webpack配置中？

tsconfig：从主应用程序中隔离子模块

0 个答案: