TypeScript问题 - TypeError: 无法读取未定义的属性'watchRun'

Question

我将尝试将我的ReactJS应用程序中的每个JSX文件逐一转换为TS。因此，我将同时运行JSX和TS文件。(因此，在webpack中添加了以下规则：)

这是处理jsx和ts文件的webpack配置的一部分：

module: {
        rules: [
            {
            test: /\.ts$/,
            exclude: /node_modules/,
            use: ["awesome-typescript-loader"]
        },
        {
            test: /\.(jsx?)$/,
            exclude: /node_modules/,
            use: ["babel-loader"]
        },
        ]
    }

但是当我运行webpack时，出现以下错误：

模块构建失败：TypeError：无法读取未定义的“watchRun”属性

使用的软件包：

"webpack": "^2.2.1"
"awesome-typescript-loader": "^5.0.0-1", 
"typescript": "^2.7.2",
"@types/react": "^16.0.40",
"@types/react-dom": "^15.5.7",
"babel-core": "^6.23.1",
"babel-loader": "^6.4.0",

我查了很多在线资源，但是没有找到任何关于watchRun问题的线索。

谢谢。

- Ivin

---

请关注此问题 https://github.com/webpack/webpack/issues/6357 - Kenry Sanchez

@KenrySanchez 谢谢。问题出在版本不匹配上。关闭该线程。 - Ivin

你能在这里发布解决方案吗？这将非常有帮助。谢谢。 - Tenten Ponce

我遇到了类似的问题。我的问题是我正在使用Webpack 3，它与awesome-typescript-loader@5不兼容。你正在使用Webpack 2，所以我想这是相同的问题。要解决问题，可以升级Webpack或降级awesome-typescript-loader。 - Tommos

Answer 1

awesome-typescript-loader 5.x与webpack 4.x兼容，您的webpack版本太旧了。尝试将webpack升级到4.x或将awesome-typescript-loader版本降级。

- pamler

---

对我来说，webpack@4.8.3、typescipt@2.8.3和awesome-typescript-loader@5.0.0也发生了这种情况:( - Dmitrii Sorin

Answer 2

解决方案是使用 4.x 版本的 Storybook，它依赖于正确版本的 Webpack（而不是当前稳定的 3.x 版本）。

例如：@storybook/react@4.0.0-alpha.8 可以与 awesome-typescript-loader@5.x 兼容。

- Charly Poly

---

你使用的是哪个版本的webpack？能否提供一个config.js和webpack.config.js的示例呢？我无法让它工作，并且目前还找不到任何适用于storybook v4的typescript示例 :( - Kriszta