我的图书馆

Question

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

我的图书馆

index.ts

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

package.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' } ] }
};

我的应用程序

index.ts

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

new Greeter().greet();

package.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' } ] }
};

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

Answer 1

使用externals

外部配置选项提供了一种排除方式输出包中的依赖项。而是创建的包依赖于存在于消费者环境中的这种依赖性。通常，此功能对库开发人员最有用。有各种各样的应用程序。

您想将@mylib用作Webpack配置中的外部库。

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

此外，Typescript还需要库的类型。因此，您需要在类型文件中定义它们。这是一个有效的例子

typings.d.ts

declare module '@mylib' {
    export class Greeter {
        greet();
    }
}

从应用程序包中排除本地TypeScript库

我的图书馆

我的应用程序

1 个答案: