我建立了一个库。我希望将它与 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
})
]
};