0

如何从为我的应用程序创建的包中排除本地 TypeScript 库?在我的用例中,我想将我的 TypeScript 库的包和我的应用程序的包作为单独的 JavaScript 文件提供。

我的图书馆

索引.ts

export class Greeter {
    public greet(): void {
        console.log("Hello World"); 
    }
}

包.json

{
    "private": true,
    "devDependencies": {
        "typescript": "3.1.1",
        "ts-loader": "5.2.1",
        "webpack": "4.20.2",
        "webpack-cli": "3.1.2"
    },
    "scripts": {
        "start": "webpack"
    }
}

tsconfig.json

{
    "compilerOptions": {
        "module": "es6",
        "target": "es5"
    }
}

webpack.config.js

module.exports = {
    entry: './src/index.ts',
    resolve: { extensions: [".js", ".ts"] },
    output: { filename: 'bundle.js', library: '@mylib', libraryTarget: 'umd' },
    module: { rules: [ { test: /\.ts$/, use: 'ts-loader' } ] }
};

我的应用程序

索引.ts

import {Greeter} from "@mylib/index";

new Greeter().greet();

包.json

{
    "private": true,
    "devDependencies": {
        "typescript": "3.1.1",
        "tsconfig-paths-webpack-plugin": "3.2.0",
        "ts-loader": "5.2.1",
        "webpack": "4.20.2",
        "webpack-cli": "3.1.2"
    },
    "scripts": {
        "start": "webpack"
    }
}

tsconfig.json

{
    "compilerOptions": {
        "baseUrl": ".",
        "paths": { "@mylib/*": ["../mylib/src/*"] },
        "module": "es6",
        "target": "es5"
    }
}

webpack.config.js

const TsconfigPathsPlugin = require('tsconfig-paths-webpack-plugin');

module.exports = {
    entry: './src/index.ts',
    resolve: { extensions: [".ts", "js"], plugins: [new TsconfigPathsPlugin({})] },
    output: { filename: 'bundle.js' },
    module: { rules: [ { test: /\.ts$/, use: 'ts-loader' } ] }
};

在我的示例中,库代码包含在应用程序包中。我希望不包含该库,以便我可以将其作为单独的捆绑包提供。

4

1 回答 1

1

使用外部

externals 配置选项提供了一种从输出包中排除依赖项的方法。相反,创建的包依赖于存在于消费者环境中的依赖项。此功能通常对库开发人员最有用,但它有多种应用程序。

您想@mylib在 webpack 配置中作为外部库进行广告。

externals : {
  '@mylib': 'mylib',
},

此外,Typescript 还需要库的类型。所以你需要在类型文件中定义它们。这是一个工作示例

打字.d.ts

declare module '@mylib' {
    export class Greeter {
        greet();
    }
}
于 2018-10-02T14:13:26.080 回答