brunch.io conventions.ignored does not respect node_modules - brunch

Question

I'm building an app that has multiple entry points. It's a plugin/sideloading react architecture.
I have a base react app compiling into app.js and vendor.js just fine. The issue originates with the secondary project, the theme, being bundled with some of the same dependencies. Most notably react and react-dom. I would like to be able to use conventions.ignored to instruct brunch to ignore specific node_modules and their dependencies. Regardless of the regex I put in conventions.ignored I still get react and react-dom in the theme_vendor.js bundle. See config below:
const {theme_name} = require('./package.json');
module.exports = {
sourceMaps: 'inline',
files: {
javascripts: {
joinTo: {
"theme.js": [
/^theme/,
],
"theme_vendor.js": [
/^(?!theme)/,
],
}
},
stylesheets: {
joinTo: {
'theme.css': ["theme/config/styles/index.scss"],
'theme_ie11.css': ["theme/config/styles/ie.scss"],
}
}
},
conventions: {
ignored: [
/\/_/,
"node_modules\/react",
"node_modules\/react-dom",
],
},
plugins: {
babel: {
presets: ['es2015', 'stage-0', 'react'],
plugins: [
['transform-runtime', {
polyfill: false,
regenerator: true
}]
],
},
sass: {
options: {
includePaths: [],
precision: 15
},
mode: 'native',
sourceMapEmbed: true,
debug: 'comments'
},
copycat: {
"fonts/slick-carousel": ["node_modules/slick-carousel/slick/fonts"],
"img/slick-carousel": ["node_modules/slick-carousel/slick/ajax-loader.gif"],
"": ["theme/theme_header.tmpl", "theme/theme_body.tmpl", "theme/theme_footer.tmpl"],
}
},
modules: {
nameCleaner: path => path.replace('', theme_name + '/')
},
notifications: false,
hot: false,
paths: {
public: '../',
watched: [
'theme',
'initialize.js',
]
},
overrides: {
production: {
optimize: true,
sourceMaps: false,
plugins: {
autoReload: {
enabled: false
}
},
paths: {
// public: "dist/"
}
}
}
};
The only way I have been able to achieve anything close is to use a negation in the joinTo. See Below:
javascripts: {
joinTo: {
"theme.js": [
/^theme/,
],
"theme_vendor.js": [
/^(?!theme|node_modules\/react|node_modules\/react-dom)/,
],
}
},
Other info:
"dependencies": {
"react-click-outside": "^2.2.0",
"react-image-gallery": "^0.7.15",
"react-slick": "^0.14.7",
"slick-carousel": "^1.6.0"
},
"devDependencies": {
"auto-reload-brunch": "^2",
"babel-brunch": "~6.0.0",
"babel-plugin-transform-runtime": "^6.23.0",
"babel-preset-es2015": "^6.24.0",
"babel-preset-react": "~6.22",
"babel-preset-stage-0": "^6.22.0",
"brunch": "^2",
"clean-css-brunch": "^2",
"copycat-brunch": "^1.1.0",
"hmr-brunch": "^0.1",
"redux-devtools": "^3.3.2",
"redux-devtools-dock-monitor": "^1.1.1",
"redux-devtools-log-monitor": "^1.2.0",
"sass-brunch": "^2.10.4",
"uglify-js-brunch": "^2",
"isomorphic-fetch": "^2.2.1",
"react": "^15.4",
"react-addons-css-transition-group": "^15.4.2",
"react-dom": "^15.4",
"react-redux": "~4.3.0",
"react-router": "^3.0.2",
"react-router-redux": "^4.0.8",
"redux": "~3.2.1",
"redux-form": "^6.6.2",
"redux-logger": "^3.0.0",
"redux-saga": "^0.14.3"
}

Answer 1

I think you need to do this:
conventions: {
vendor: /(^bower_components|node_modules(?!\/react)|vendor)\//
}
See also the docs.
This regex will not match the two react node modules and therefore will not be included in your file.