在webpack捆绑包中添加特定的节点模块

问题描述

我在我的React项目添加了Bulma扩展之一

要使用它，我已经使用npm和extension安装了它，当DOM完全加载时，需要在下面添加行，因此我将其添加到componentDidMount

var quickviews = bulmaQuickview.attach();

在我的index.html中的行下方

<script type="text/javascript" src="/node_modules/bulma-extensions/bulma-quickview/dist/js/bulma-quickview.min.js"></script>

我正在使用webpack捆绑＆从捆绑中排除了所有节点模块。

问题：在用于webpack的开发环境中，它可以正常工作，但在将其捆绑用于生产后，却给我以下错误：

bulmaQuickview未定义

如何在Webpack捆绑包中捆绑特定的节点模块？ 以及将添加什么正确的参考。

Webpack配置

module.exports = {
    target: 'web',
    entry: "./index.js",
    output: {
        filename: "bundle.js"
    },
    devtool: 'eval-source-map',
    module: {
        rules: [
            {
                test: /\.js$/,
                exclude: /node_modules/,
                use: {
                    loader: "babel-loader"
                }
            },
            {
                test: /\.css$/,
                use: ExtractTextPlugin.extract({
                    fallback: "style-loader",
                    use: "css-loader"
                })
            },
            {
                test: /\.(png|jpg)$/,
                use: [{
                    loader: 'url-loader',
                    options: {
                        limit: 8000, // Convert images < 8kb to base64 strings
                        name: 'images/[hash]-[name].[ext]'
                    }
                }]

            },
            {
                test: /\.(png|svg|jpg|gif)$/,
                include: path.join(__dirname, 'dist/image'),
                loader: 'file-loader'

            }
        ]
    },
    plugins: [new WebpackNotifierPlugin(), new BrowserSyncPlugin(), new ExtractTextPlugin("styles.css"),
        new webpack.DefinePlugin({
            'API_URL': API_URL[environment]
        })
    ]
};