I built a library.I hope to use it with a sript tag as a external library just like this:
<script src="path/to/mylibrary" crossorigin="anonymous"></script>
My library requires react,I expect the project which use mylibrary will provide react in the environment.I use webpack dll plugin in my project to build the libraries such as react,lodash in a bundle named vendors.js. But it doesn't work,my library couldn't find the external libraries I hope my project can provide.How can I solve this problem?
here is the webpack config in my library:
output: {
path: `${__dirname}/lib`,
filename: 'index.js',
library: 'mylibrary',
libraryTarget: 'umd',
},
externals: /^[@a-z]/,
this is webpack config in my project:
externals: {
'mylibrary': 'mylibrary'
},
dll config:
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
})
]
};