gpt4 book ai didi

node.js - Webpack 无法解析 JS 模块(在 Typescript 项目中)

转载 作者:搜寻专家 更新时间:2023-10-30 21:40:31 24 4
gpt4 key购买 nike

我在将第 3 方库与 Typescript、自定义类型和 Webpack 结合使用时遇到问题。 Webpack 无法解析第 3 方 JS 库。

每当我手动编译我的 .ts 文件并使用 Node.js 运行它时,它都会毫无问题地编译并按预期执行。但是,当我运行 Webpack 时它退出并出现错误:

ERROR in ./index.ts
Module not found: Error: Can't resolve '@slack/client' in 'Z:\reproduction'
@ ./index.ts 1:0-45

我的第一个直觉是它与 scoped package 有关(@slack/客户)。我尝试使用 aliases结合path mapping在这个包的 tsconfig 中,但这并没有解决问题。此外,将包直接复制到 ./node_modules 并从定义文件和导入中删除范围部分并没有修复它。

我设法在一个小项目中重现了这个问题。我向这个复制项目添加了两个依赖项:“@slack/client”(无法解析的库)和“abs”(作为完整性检查)。我为两者创建了小的 .d.ts 定义文件。 abs 库运行完美,但 @slack/client 对于 Webpack 仍然无法解析。

我对 Typescript 和 Webpack 很陌生,所以我怀疑我忽略了一些明显的东西。我只是不知道是什么。好消息是,尝试解决这个问题已经让我想到了很多关于 Webpack 和 Typescript :-)

谁能指出我正确的方向?

我设法用以下文件重现它:

package.json

{
"devDependencies": {
"awesome-typescript-loader": "^3.0.0-beta.18",
"typescript": "^2.1.5"
},
"dependencies": {
"@slack/client": "^3.8.1",
"abs": "^1.3.6"
}
}

tsconfig.json

{
"compilerOptions": {
"module": "commonjs",
"target": "es5",
"noImplicitAny": true,
"sourceMap": false
}
}

webpack.config.js

module.exports = {
entry: './index.ts',
target: 'node',
module: {
loaders: [
{
test: /\.ts(x?)$/,
loader: 'awesome-typescript-loader'
}
]
},
resolve: {
extensions: ['.ts'],
},
output: {
libraryTarget: 'commonjs',
path: './',
filename: 'index.js'
}
}

abs.d.ts

declare module 'abs' {
function abs(input: any): any;
namespace abs {}
export = abs;
}

@slack_client.d.ts

declare module '@slack/client' {
export const CLIENT_EVENTS: {
RTM: {
ATTEMPTING_RECONNECT: string;
};
};
}

index.ts

import * as slackClient from '@slack/client';
import * as abs from 'abs';

var absPath: string = abs('./');
console.log(absPath);

var added: string = slackClient.CLIENT_EVENTS.RTM.ATTEMPTING_RECONNECT;
console.log(added);

注释

  • @slack/client 的定义文件可能看起来有点奇怪,因为名称中有@。我尝试为这两个定义更改它,但这并没有太大作用。 Abs 一直在工作,@slack/client 一直在失败。
  • 网络包版本:2.2.1
  • typescript 版本:2.1.5

最佳答案

我怀疑这一行:

extensions: ['.ts']

需要:

extensions: ['.js', '.ts']

甚至更好:

extensions: ['.js', '.ts', '.tsx']

捕获大多数情况。

关于node.js - Webpack 无法解析 JS 模块(在 Typescript 项目中),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41967238/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com