node.js - 将我的库分为库、核心和插件

Question

我是这个世界上的新手，所以请耐心等待。

我有一个大库，我正在尝试将其转换为 es6 模块、babel 和 webpack，以便稍后将其捆绑到多个文件中。

我的库文件夹如下所示

--src
  -- core
     -- folder1
     -- folder2
  -- addons
     -- addon 1
        -- addon 1 files and folders
     -- addon 2
        -- addon 2 files and folders
  -- libs
     -- internal
        -- internal lib1 
        -- internal lib2 
     -- external
        -- external lib1 
        -- external lib2 

我的库代码分为 2 个部分 - 核心代码和插件，我正在使用一些库(libs 文件夹)

我的愿望是:

• 所有内部库将捆绑到一个库文件中
• 外部库从 bundle 中排除
• 所有核心文件将捆绑为一个核心文件
• 我的所有插件都将捆绑到每个插件文件中
• 注意:插件正在使用核心文件，并且不会捆绑在其中

最终结果:库.js核心.js插件1.js插件2.js

我的客户必须使用前 2 个 js 文件。和 Addon 将按照他们的意愿包含在内。

到目前为止，我已经成功使用 CommonsChunkPlugin 分离了我的内部库

new webpack.optimize.CommonsChunkPlugin({
    name: "libs",
    minChunks: function(module){
      return module.context && module.context.indexOf("\\libs\\internal\\") !== -1;
    },
  });

使用null-loader忽略外部库

{
   test: /libs\\external/,
   loader: 'null-loader'
},

我的入口点js看起来像这样

导入自

"./core/a";
import b from "./core/b";
import addon1C from "./addons/addon1/c";

const myLib = {
   core: {a,b},
   addons: {addon1C}
}

export {myLib}

现在问题始于核心和插件。

如果我跳过插件部分，在我的客户端包括 2 个脚本(库、核心)

并且myLib.core.a正在工作。

问题是我是否要阻止插件中核心代码的捆绑。

我尝试使用另一个 block 插件来完成此操作，但它会在模块中导致一些错误，因为插件正在使用核心代码，并且入口点正在使用插件来导出它，因此它找不到模块.

尝试了 2 个入口点，所以我将拥有第一个没有插件的入口点并单独导出插件，但现在核心代码捆绑在其中。

那么，我该怎么做呢？或者是否有更好的方法来完成我迄今为止所做的任何事情。我很高兴学习。

Answer 1

为了实现这一目标，我认为您必须使用不同的方法。我遇到过类似的情况，其他一些团队需要按需扩展应用程序的核心功能。

为了实现这一目标，我必须确保核心和附加组件不会直接相互通信。相反，您的核心代码应该提供某种可供您的附加组件使用的 API。

从另一端来看，当您的附加组件尝试导入核心时，您必须提供一个 shim 文件，而不是核心本身。

我会尝试在这里写几个例子:

// core
export default const Core = {}
const addons = []
Core.addPlugin = function(addOn) {
   addons.push(addOn) // or doing something else
}

// shim-core.js
export default typeof window.Core !== undefined ? window.Core : Core

// add-on
import Core from 'shim-core'
const addOn = function() {
   // something funky
   return {}
}
Core.addPlugin(addOn)

希望它能帮助您理解“架构”