javascript - 将本地 npm 库与 es6、babel 和 webpack 结合使用

Question

我遇到了一个问题，这似乎是由于我对 webpack 缺乏了解所致。我创建了一个如下所示的文件结构:

|-serverless-cloud-functions
||-my-local-libs
|||-twilioClient
||-service1
||-service2

twilioClient是我制作的一个库，需要包含在service1和service2中。由于无服务器框架的限制，您无法捆绑服务外部的文件，因此唯一的选择(我认为)是从服务文件夹内使用 npm install ../my-local-libs/twilioClient 。这适用于安装模块，但现在它驻留在node_modules中。目前，我也在使用 webpack 和 babel。

我相信我的根本问题是我的 webpack 配置如下所示:

const slsw = require("serverless-webpack");
const nodeExternals = require("webpack-node-externals");

module.exports = {
    entry: slsw.lib.entries,
    target: "node",

    externals: [nodeExternals()],

    module: {
        rules: [
            {
                test: /\.js$/,
                loader: "babel-loader",
                exclude: /node_modules/
            }
        ]
    }
};

这不包括我的 es6 twilioClient lib，因为它位于 node_modules 文件夹中。

我看到一些人建议这是完成“排除 Node 模块中除 twilioClient 之外的所有内容”的方法:

module.exports = {
    entry: slsw.lib.entries,
    target: "node",

    externals: [nodeExternals()],

    module: {
        rules: [
            {
                test: /\.js$/,
                loader: "babel-loader",
                exclude: /node_modules\/(?!(twilioClient))/
            }
        ]
    }
};

但这对我来说不起作用。非常感谢任何帮助。

Answer 1

您可以使用 Babel 单独编译它，而不是尝试排除 twilioClient。像这样的东西(在 twilioClient 目录中):

npx babel src --out-dir lib

在twilioClient/package.json中，您可以将main设置为lib/index.js而不是src/index.js，以便导入脚本将获得编译后的版本:

"main": "lib/index.js",

然后，您可以将其推送到 github，然后使用 npm 将其安装在每个客户端中，而不是将 twilioClient 与 service1 和 service2 一起托管:

npm install --save http://github.com/your_github_username/twilioclient.git

现在您可以使用 twilioClient，就好像它是任何其他 npm 依赖项一样。