2

我建立了一个库。我希望将它与 sript 标签一起用作外部库,就像这样:

<script src="path/to/mylibrary" crossorigin="anonymous"></script>

我的库需要 react,我希望使用 mylibrary 的项目将在环境中提供 react。我在我的项目中使用 webpack dll 插件在名为 vendor.js 的包中构建诸如 react、lodash 之类的库。但它不起作用,我的库找不到我希望我的项目可以提供的外部库。我该如何解决这个问题?

这是我的库中的 webpack 配置:

    output: {
      path: `${__dirname}/lib`,
      filename: 'index.js',
      library: 'mylibrary',
      libraryTarget: 'umd',
    },
    externals: /^[@a-z]/,

这是我项目中的 webpack 配置:

externals: {
    'mylibrary': 'mylibrary'
  },

dll配置:

module.exports = {
    entry: {
        'vendors': [
            'react',
      'react-dom',
      'redux',
      'react-redux',
      'react-router',
        ]
    },
    output: {
        path: ENV === 'DEV' ? __dirname + '/dist' : path.join(__dirname, process.env.BUILD_DEST || 'build'),
        filename: '[name].js',
    library: '[name]',
    libraryTarget: 'umd',
  },
  module: {
    rules: [
      {
        test: /\.less$/,
        use: ['style-loader', 'css-loader', 'less-loader']
      }
    ]
  },
    resolve: {
        extensions: ['.js', '.jsx']
    },
    plugins: [
        new webpack.DllPlugin({
      path: 'manifest.json',
      name: '[name]',
      context: __dirname
        })
    ]
};
4

0 回答 0