So I need to set the alternative to Rollup's external option (external: path => /^three/.test( path )) in Webpack
As I understand in webpack it's called externals, but I don't know how to set it in extend (config, ctx) {} in nuxt.config.js.
config.module.externals = /^three/ doesn't seem to work, even though in webpack docs I've seen this example:
module.exports = {
//...
externals: /^(jquery|\$)$/i
};
My config in nuxt.config.js:
/*
** You can extend webpack config here
*/
extend (config, ctx) {
config.module.rules.push(
{
test: /\.(glsl|vs|fs|vert|frag)$/,
exclude: /node_modules/,
use: 'raw-loader'
}
)
}
I come to this since have same issue a hours ago, and this work for me :D
build: {
extend(config, { isDev, isClient }) {
config.externals = function (context, request, callback) {
if (/xlsx|canvg|pdfmake/.test(request)) {
return callback(null, 'commonjs ' + request)
}
callback()
}
},
},
https://webpack.js.org/configuration/externals/
so you don't need add config.module.external because the config is module it self
build: {
extend(config, { isDev, isClient }) {
config.externals = [
{
// String
react: 'react',
// Object
lodash: {
commonjs: 'lodash',
amd: 'lodash',
root: '_', // indicates global variable
},
// [string]
subtract: ['./math', 'subtract'],
},
// Function
function ({ context, request }, callback) {
if (/^yourregex$/.test(request)) {
return callback(null, 'commonjs ' + request);
}
callback();
},
// Regex
/^(jquery|\$)$/i,
];
},
},
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With