捆绑和使用webpack构建的打字稿库的正确方法？

问题描述：

我最近开始使用typescript，无法理解如何构建一个使用webpack的其他打字稿模块中使用的打字稿库。捆绑和使用webpack构建的打字稿库的正确方法？

此外，这个库，并打算在浏览器中运行。

目前我已经结束了以下结构，并建立输出：

lib 
├── build 
│   ├── typings // tsc output with declaration:true 
│   │   ├── Bar.d.ts 
│   │   └── Foo.d.ts 
│   └── lib.bundle.js //webpack bundle file 
├── src 
│   ├── Bar.ts 
│   └── Foo.ts 
├── bower.json 
├── package.json 
└── tconfig.json

的WebPack配置：

webpackOptions = { 
    resolve: { extensions: ['', '.ts'] }, 
    module: { 
     loaders: [{ test: /\.ts$/, exclude: [/node_modules/,/out/,/.*\.d\.ts/],include:[/\.ts$/], loaders: ['ts-loader']}] 
    }, 
    ts:{ 
     compilerOptions:compilerOptions 
    }, 
    output: { 
     library:"mylib", 
     libraryTarget:'commonjs', 
     filename: 'mylib.bundle.js' 
    } 
    }

tsconfig.json：

{ 
    "compilerOptions": { 
    "target": "es5", 
    "module": "commonjs", 
    "sourceMap": true, 
    "outDir":"out", 
    "declaration": true 
    }, 
    "exclude": [ 
    "node_modules", 
    "bower_components", 
    "typings/global", 
    "build" 
    ] 
}

一第二Foo.ts例如：

export class Foo{ 
    foo(){} 
}

Bar.ts：

import {Foo} from './Foo' 
export class Bar{ 
    public foo:Foo = new Foo(); 
}

所以我有以下建输出：

的WebPack束
打字稿声明每个文件

而问题是：

如何导入/消耗通过凉亭该库在其他浏览器应用程序（将使用带有的WebPack打字稿太）？
在使用此库的应用程序中使用哪种导入语法（例如，import .. from或require）？
也许我不应该使用webpack捆绑库呢？

UPDATE：二手NPM管理打字稿模块之间的本地依赖性不亭子由@basarat的建议和一切运行良好

答

也许我不应该使用的WebPack在所有
捆绑库

这是我推荐的。将捆绑销售给顶级应用程序用户。

例如，这里是一个模块csxhttps://github.com/basarat/csx你可以在TypeScript中使用。你可以看到它没有以任何特殊的方式捆绑在一起。它的只是一个节点模块。如果人想在浏览器中捆绑使用它是对他们

https://basarat.gitbooks.io/typescript/content/docs/quick/nodejs.html

我也要去的只是提供编译.js文件，并把它留给应用程序的路径开发人员了解我的库应该如何捆绑到他们的应用程序中。 –

好的。当节点应用程序通过NPM使用库时，这是与节点模块一起使用的方式。在使用bower的应用程序中如何使用TS库？我已经拥有一个现有的TS应用程序，它具有在bower和ambient类型定义中管理的依赖关系。是否可以通过NPM导入库并通过webpack/broserify与应用程序绑定？ – Dagon

看看http://young-programmer.life/2017/02/creating-a-typescript-library-using-webpack/ –

捆绑和使用webpack构建的打字稿库的正确方法？

更多

相关推荐