javascript - 如何使用纯 TypeScript 库作为 Webpack 的依赖项?

标签 javascript typescript webpack

我有 3 个存储库 - clientbackendinterfaces

全部用 TypeScript 编写。客户端和后端 repos 在构建阶段编译成 JavaScript,然后部署到服务器。

最后一个 repo interfaces 不应该被编译成任何东西,而只是用作客户端和后端 repos 的 npm 依赖项,声明客户端和后端应用程序如何相互通信。

在我引入 interfaces 存储库并将其作为依赖项添加到其他两个存储库之前,我使用了硬编码的消息类型字符串并且所有编译都很好。

现在,有了纯粹的 TypeScript 依赖项,即 interfaces,我可以将类型从它注入(inject)到 clientbackend repo 代码中并查看它们连接正确。

但问题是我现在无法编译项目,因为在 Webpack 中似乎没有为这种情况正确配置某些东西。

这是webpack.config.js的相关部分:

module: {
    rules: [
        {
            test: /\.js$/,
            use: 'babel-loader',
            // exclude: /node_modules/
        },
        {
            test: /\.ts$/,
            use: 'ts-loader',
            exclude: /node_modules/
        }
    ]
},

对于这个,我在尝试使用 webpack 构建时看到一个错误:

ERROR in ./node_modules/myapp_interfaces/interfaces/ClientRequestPayload.ts

Module parse failed: The keyword 'interface' is reserved (1:0)

You may need an appropriate loader to handle this file type.

如果我注释掉 exclude:/node_modules/,我会看到:

ERROR in ./node_modules/myapp_interfaces/index.ts

Module build failed: Error: Typescript emitted no output for /myapp/myapp_backend/node_modules/myapp_interfaces/index.ts.

You should not need to recompile .ts files in node_modules.

Please contact the package author to advise them to use --declaration --outDir.

我想如果这个接口(interface)代码在项目的另一个文件夹中,它会正常工作。

我如何摆脱这个错误并将它们导入我的代码然后编译?

最佳答案

如果您从 ts-loader 中排除/node_modules/是不是应该没有正确导入此文件夹中的 .ts 文件?

关于javascript - 如何使用纯 TypeScript 库作为 Webpack 的依赖项?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47690617/

相关文章:

javascript - 带有放大弹出窗口的灯箱不起作用

javascript - 显示选定的 ionic ListView

angular - 在我的 Angular2 环境中使用 typescript 使用/导入 azure-storage

webpack - 如何让webpack在构建项目后退出

typescript - Webpack typescript 热重载未编译

javascript - 禁用焦点 - jQuery

javascript - Angular 需要点击两次才能显示 Google 地理编码位置

javascript - FromEvent Keyup 过滤器未按预期工作

typescript :对象可能是 'undefined' 但仅适用于 '<' 和 '>' 运算符

node.js - 如何抑制 webpack 终端输出中构建的模块?