Skip to content
This repository has been archived by the owner on Jun 15, 2023. It is now read-only.

conventions.ignored does not respect node_modules #260

Open
menkveldj opened this issue Apr 16, 2017 · 3 comments
Open

conventions.ignored does not respect node_modules #260

menkveldj opened this issue Apr 16, 2017 · 3 comments

Comments

@menkveldj
Copy link

menkveldj commented Apr 16, 2017

Hi,
Sorry about the double post - not sure where you want it. I have also posted this question on stack-o so feel free to remove this one if needed:
http://stackoverflow.com/questions/43438375/brunch-io-conventions-ignored-does-not-respect-node-modules

I'm building out 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 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)/,
                ],
            }
        },

Thanks in advanced for your help.
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"
 }
@denysdovhan
Copy link
Contributor

Hi, @menkveldj! Thanks for question.

Sorry about the double post - not sure where you want it.

It's okay. For future, better to open issues in brunch/brunch repo.

I'm trying to reproduce your problem. Could you wrap everything up in single repo? That would make my work easier. Thanks.

@menkveldj
Copy link
Author

@denysdovhan I will for sure post there next time.

I have created a repo and given you permissions to it:
https://github.com/menklab/brunch-ignore-issue

The react app won't actually load but that's not necessary. To replicate:

cd src
npm install
npm start

themes_vendor.js builds to ../
search for: register("react-dom")
I would expect not to see react-dom or anything that is pulls in as dependencies.

Thanks.

@denysdovhan
Copy link
Contributor

Nice! Thanks for the repo.

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Development

No branches or pull requests

2 participants