Question

我想使用webpack将我的JS捆绑在一起用于React组件，但不包括React或React Dom，只是我自己的React代码。

我的想法是，我可以在网页上使用RequireJS单独加载React或React Dom，因为我将组件添加到Magento2，后者使用这种方法添加JS依赖项。我的想法是，如果我以这种方式添加另一个组件，我不想两次添加React库。

我想我需要使用不同的babel loader或传递其他一些选项？

这是我的webpack.config

const path = require('path');
const autoprefixer = require('autoprefixer');
const webpack = require('webpack');

module.exports = {
    devtool: 'cheap-module-source-map',
    entry: './src/index.js',
    output: {
        path: path.resolve(__dirname, 'web'),
        filename: 'js/react-component.js',
        publicPath: ''
    },
    resolve: {
        extensions: ['.js', '.jsx']
    },
    module: {
        rules: [
            {
                test: /\.js$/,
                exclude: /node_modules/,
                loader: 'babel-loader'
            }
        ]
    },
    plugins: [
        new webpack.optimize.UglifyJsPlugin()
    ]
}

它可以工作，但正如我所说，它包含生成的js/react-component.js文件中的完整反应库。有什么建议我怎么做？

Answer 1

正如@Aaqib所指出的，我需要将此配置选项添加到webpack。

externals : {
  react: 'react',
  reactDom: 'react-dom'
}

Webpack捆绑JS没有React或React Dom

1 个答案: