Ts-loader/webpack - 如何使用 webpack 解析工作文件夹之外的文件

Kir*_*Kir 5 typescript webpack ts-loader

我有一个项目恰好是 vs 代码扩展,但我认为这不太相关。

我有以下结构:

./package.json
./tsconfig.json --> references [ ./client, ./server, ./interfaces]

./client
   package.json
   tsconfig.json
   webpack.config.js
./server
   package.json
   tsconfig.json
   webpack.config.js
./interfaces
   package.json
   tsconfig.json
Run Code Online (Sandbox Code Playgroud)

客户端和服务器都从接口项目导入,它只包含一些由两者共享的类型、接口、枚举、命名空间等。对于它的价值,我不介意的WebPack复制到两个client.js和server.js捆绑这一点,但我希望复制/粘贴两者的代码。

当我运行我的 webpack 时,无论我从interfaces. 我应该注意到,正常通过tsc -b工程完美地构建。

TS2769:没有与此调用匹配的重载。重载 1 of 3, '(type: RequestType0<{}, unknown, unknown>, handler: RequestHandler0<{}, unknown>): void',出现以下错误。“RequestType”类型的参数不可分配给“RequestType0<{}, unknown, unknown>”类型的参数。属性“_”的类型不兼容。输入 '[MyType, MyOtherType, void, void, _EM] | undefined' 不能分配给类型 '[{}, unknown, unknown, _EM] | 不明确的'。类型“[MyType, MyOtherType, void, void, _EM]”不能分配给类型“[{}, unknown, unknown, _EM]”。属性“3”的类型不兼容。“void”类型不能分配给“_EM”类型。重载 2 of 3, '(type: RequestType, handler: RequestHandler): void',出现以下错误。“RequestType”类型的参数不可分配给“RequestType”类型的参数。类型具有私有属性“_method”的单独声明。重载 3 of 3, '(method: string, handler: GenericRequestHandler<{}, unknown>): void',出现以下错误。“RequestType”类型的参数不可分配给“string”类型的参数。给出了以下错误。“RequestType”类型的参数不可分配给“string”类型的参数。给出了以下错误。“RequestType”类型的参数不可分配给“string”类型的参数。

它似乎无法正确处理接口内的东西。

我的 webpack 配置看起来像这样(它们大致相同,除了文件名):

./package.json
./tsconfig.json --> references [ ./client, ./server, ./interfaces]

./client
   package.json
   tsconfig.json
   webpack.config.js
./server
   package.json
   tsconfig.json
   webpack.config.js
./interfaces
   package.json
   tsconfig.json
Run Code Online (Sandbox Code Playgroud)
// ./shared.webpack.config.js
const path = require('path');
const merge = require('merge-options');

module.exports = function withDefaults(/**@type WebpackConfig*/extConfig) {

    /** @type WebpackConfig */
    let defaultConfig = {
        mode: 'none', // this leaves the source code as close as possible to the original (when packaging we set this to 'production')
        target: 'node', // extensions run in a node context
        node: {
            __dirname: false // leave the __dirname-behaviour intact
        },
        resolve: {
            mainFields: ['module', 'main'],
            extensions: ['.ts', '.js'] // support ts-files and js-files
        },
        module: {
            rules: [{
                test: /\.ts$/,
                exclude: /node_modules/,
                use: [{
                    // configure TypeScript loader:
                    // * enable sources maps for end-to-end source maps
                    loader: 'ts-loader',
                    options: {
                        compilerOptions: {
                            "sourceMap": true,
                        }
                    }
                }]
            }]
        },
        externals: {
            'vscode': 'commonjs vscode', // ignored because it doesn't exist
        },
        output: {
            // all output goes into `dist`.
            // packaging depends on that and this must always be like it
            filename: '[name].js',
            path: path.join(extConfig.context, 'out'),
            libraryTarget: "commonjs",
        },
        // yes, really source maps
        devtool: 'source-map'
    };

    return merge(defaultConfig, extConfig);
};

I borrowed these webpack configurations from a similar VS Code extension, although the original extension did not use an `interfaces` project, they just duplicated all the code.

I'm a webpack newbie; how should I modify these configurations to process the interfaces?
Run Code Online (Sandbox Code Playgroud)

编辑:如果我include在所有 3 个文件夹的共享 webpack 配置中明确添加一个块,我会收到一个不同的错误,说类型不可分配,因为类型引用了另一个第三方包,所以从技术上讲,该包有两个实例:

类型具有私有属性“_method”的单独声明。