brunch / brunch.github.io

The website
https://brunch.io
MIT License
114 stars 99 forks source link

conventions.ignored does not respect node_modules #260

Open menkveldj opened 7 years ago

menkveldj commented 7 years ago

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 commented 7 years ago

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 commented 7 years ago

@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 commented 7 years ago

Nice! Thanks for the repo.