導出由webpack構建的模塊

Question

我正在編寫3個模塊作為npm模塊發布

• 管理員（具有核心依賴項）
• 成員（具有核心依賴性）
• 核心

core中的package.json：

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

管理員中核心的使用情況：

import core from "core"

所有模塊都是由webpack構建的。

問題是，如果我使用webpack構建Core ，生成bundle.js並讓Admin導入bundle.js很多庫將被復制。

例如Angular，bootstrap等。

我現在正在做的是在admin導入條目文件src/index.js

core中的package.json：

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

管理員中核心的使用情況：

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的庫選項來完成。