react ts-loader not working with babel loader webpack(反应TS-装载机不与巴别塔装载机webpack一起工作)

转载 作者：bug小助手 更新时间：2023-10-24 22:42:58 27 4

ERROR in ./src/index.ts 4:12
Module parse failed: Unterminated regular expression (4:12)
File was processed with these loaders:
 * ./node_modules/ts-loader/index.js
You may need an additional loader to handle the result of these loaders.
| var ROOT_ID = 'main';
| var App = function () {
>     return />;
| };
| var root = createRoot(document.getElementById(ROOT_ID));

ERROR in ...\client\src\index.ts
./src/index.ts 7:10-11
[tsl] ERROR in ...\client\src\index.ts(7,11)
      TS1005: '>' expected.

ERROR in ...\client\src\index.ts
./src/index.ts 7:11
[tsl] ERROR in ...\client\src\index.ts(7,12)
      TS1161: Unterminated regular expression literal.

...

ERROR in ...\client\src\index.ts
./src/index.ts 12:13-16
[tsl] ERROR in ...\client\src\index.ts(12,14)
      TS2749: 'App' refers to a value, but is being used as a type here. Did you mean 'typeof App'?

...
...

ERROR in ...\client\src\containers\home.ts
2:22-42
[tsl] ERROR in ...\client\src\containers\home.ts(2,23)
      TS2307: Cannot find module 'components/theatre' or its corresponding type declarations.

 - Client
   |> babel.config.json
   |> tsconfig.json
   |> webpack.common.js
   ... other files

{
  "presets": ["@babel/preset-env", "@babel/preset-react", "@babel/preset-typescript"],
  "plugins": ["babel-plugin-styled-components"]
}

{
  "compilerOptions": {
    "allowJs": true,
    "allowSyntheticDefaultImports": true,
    "esModuleInterop": true,
    "jsx": "react",
    "module": "es6",
    "moduleResolution": "node",
    "noImplicitAny": true,
    "outDir": "../static/js",
    "sourceMap": true,
    "target": "es5"
  }
}

module.exports = {
  entry: ["./src/index.ts"],
  output: {
    filename: 'bundle.js',
    path: path.join(some path)
  },
  resolve: {
    extensions: [".js", ".ts", ".tsx"] 
  },
  module: {
    rules: [
      {
        test: /\.tsx?$/,
        use: 'ts-loader',
        exclude: /node_modules/
      },
      {
        test: /\.js$/,
        exclude: /node_modules/,
        loader: "babel-loader"
      }
    ]
  },
  ...
}

27 4 0

• mpeg2-ts - 如何将多个 TS 文件合并为一个具有正确时间戳的 TS 文件？

  如何将多个 TS 文件合并为一个具有正确时间戳的 TS 文件？我可以将文件合并为一个，而无需接触数据。这将生成一个可播放的文件，但时间戳不正确，因此不会显示时间线(例如在 VLC 中)。因此，我需要重

• encoding - 是否可以使用 FFMPEG 将 HLS ts 文件集合中的一个 ".ts"文件替换为另一个 ".ts"文件？

  有一个视频，其实是一个HLS流(TS文件的序列) 我想取出一个 TS block 并用另一个替换它。 另一个 block 将使用相同的 FFMPEG 编码设置进行编码。 如果你想知道我为什么需要这个:

• c++ - "template struct overloaded : Ts... { using Ts::operator()...; };"是什么意思，它如何与 std::visit 一起使用？

  这段代码取自https://en.cppreference.com/w/cpp/utility/variant/visit using var_t = std::variant; template s

• ts-node - 如何将参数传递给 ts-node 处理的脚本

  我刚刚开始使用 ts-node。这是一个非常方便的工具。运行时间看起来很清晰。但它不适用于 CLI 解决方案。我无法将参数传递到编译的脚本中。 ts-node --preserve-symlinks

• javascript - 无法从另一个 .ts 文件访问 .ts 文件中定义的函数定义

  如果您愿意花 2 美分来解决调用另一个文件中定义的函数的问题，我将不胜感激。我阅读了 Typescript 的文档，其中建议设置一个接口(interface)或一个模块，然后引用它，但我收到了与下面相

• windows - tsc ts/game.ts --out 没有文件输出

  我在努力 tsc ts/game.ts --out test.js --module amd 在我在 webstorm 中的 typescript 项目上，但是控制台没有显示任何错误，也没有输出 t

• TypeScript:*.ts 和 *d.ts 扩展名

  我已经意识到有一段时间了，一些 typescript 文件有一个 .d.ts 而其他的只有一个 .ts 扩展名。 它们代表什么？有什么区别？ 最佳答案 这些是 declaration files ，或

• c++ - 如何将variant 的值移动到variant 中？

  是否有一种简单的方法可以将std::variant中包含的数据移动到std::variant中？ 我想可以通过一个额外的类模板来切换Ts...中的所有类型，但是我想知道是否存在一种更优雅的就地方法。

• javascript - Angular - 在当前 ts 文件中包含额外的 ts 文件

  我是 Angular 的新手，正在查看文档，但我想我也应该在这里问我的问题。 我正在导出一个越来越大的类，因此我想将其分成两个文件，并将 d1、d2、d3 等存储在一个单独的文件中，然后将它们导入到

• MongoDB 无法通过指定 ts.t 找到条目(ts 是时间戳类型)

  无法通过指定 ts.t 找到条目(ts 是时间戳类型) 挖oplog，想搞清楚一秒钟有多少操作。 无法通过指定时间戳字段找到条目，其他字段可以。$在蒙戈外壳中: > db.oplog.rs.findO

• TypeScript 编译中缺少 Angular5 :polyfills. ts &\main.ts

  这是我的 Angular5 项目结构。 tsconfig.app.json 和package.json 都包含这个部分 "include": [ "/src/main.ts",

• angular - TS "Cannot find name"仅在 polyfills.ts 打开时消失

  我在 Angular 10 中有一个项目，遇到了奇怪的 TS (TSLint) 错误。在我使用 $localize 的任何地方的 Visual Studio Code 中，我都收到错误消息 Canno

• express - 客户端收到所有 .ts 文件后自动删除 .ts 和 .m3u8 文件

  所以我创建了一个快速服务器，它获取一个 mp3 文件(现在存储在本地，但稍后将从 mongo db 中获取)并使用 ffmpeg 制作 .m3u8 和 .ts 文件。文件成功发送到客户端，在客户端播放

• typescript - 如何让 ts-node 知道在 `d.ts` 文件中声明的命名空间？

  我有一个 MY_FILE.ts像这样的文件: const someFunction = (param: MY_NAMESPACE.PARAM) : boolean => { // DO SOMETHI

• typescript - 如何使用 ts-node 运行 Protractor 配置文件 (.ts)？

  我过去常常在运行前编译用 TS 编写的 e2e Protractor 测试，但现在我想出了如何在运行时编译 ts 文件——ts-node 似乎是一个很好的工具。正如许多文章所说，我在 Protract

• apache - 将 {query}.ts 重写为 ts.php?{query}

  我不熟悉 mod-rewrite，我找不到任何类似的问题或解决方案。 非常感谢... 模板: {query1}_{query2}.ts ts.php?v={query1}&seg={query2} 例

• javascript - 存储来自 service.ts 的数据以在同一个 service.ts 中使用

  我有 firestore.service.ts，在一种方法中，我在 firebase 中创建和更新了一个集合……离开该方法后，我更改了集合的“id”，但我需要这个“id”是没有丢失，因为我需要它到下一

• javascript - 如果库的实现未与 TS 项目集成，如何使用 d.ts 文件导出的常量类型？

  DefinitelyTyped 有许多库的类型定义，但当 Javascript 实现与 Typescript 分离时，我常常找不到使用它们的好方法，比如当库通过 a 将自己分配给窗口的属性时 标记，

• node.js - .npmignore - 忽略所有 *.ts 文件但不包括 *.d.ts

  我正在寻找一种在我发布到 NPM 时忽略项目中所有 .ts 文件的好方法，我可以通过将以下内容添加到我的 .npmignore 文件中来做到这一点: *.ts 但是等等......实际上我想在我的项目

• typescript - ts-loader:从其他 Yarn 工作区导入 .ts 模块

  我的 Yarn 工作区结构如下: /project package.json /packages /app package.json webpack.confi