导出 webpack 构建的模块

Question

我正在编写 3 个模块作为 npm 模块发布

• Admin（有核心有依赖）
• 成员（有核心有依赖）
• 核心

Core 中的 package.json：

{
...
"main":"dist/bundle.js"
}

在 Admin 中使用核心：

import core from "core"

所有模块都是由 webpack 构建的。

问题是，如果我使用 webpack 构建Core，生成bundle.js，并让Admin 导入bundle.js，很多库将被复制。

例如Angular、引导程序等。

我现在做的是在admin中导入入口文件src/index.js

Core 中的 package.json：

{
...
"main":"src/index.js"
}

在 Admin 中使用核心：

import core from "core"

但是 webpack 无法正确解析core 中的一些依赖关系，例如我在core 模块中的webpack.config.js 中设置了多个根，因此可以进行一些速记导入。

root: [
      path.resolve(__dirname, './src/'),
      path.resolve(__dirname, './src/directives')
]
// instead of relative path
import "../../myDirective.js" 
// I can use 
import "myDirective.js"; // where myDirective.js is under "src/directives/myDirective.js", but this fails when I try to build `admin` module.

有没有更简单的方法让 webpack 构建 npm-modules 以便于导入？

Core: depends on angular, bootstrap, core.js
Admin: depends on angular, bootstrap, admin.js, includes core as a module

Answer 1

这对我来说也很有趣。我建议可以通过设置webpack的library options来完成。