adding stats: 'verbose' to my webpack config.

[devo-devo]

Loving this plugin!

Came in super handy when I want to add the whyDidYourRender plugin to my app.

However, although I'm sure I'm missing something super simple, I'm trying to set my stats to verbose to no avail.

Would think it was as simple as

 webpack: {
        configure: { stats: 'verbose' },
    },

And I see my output is merging into the webpack config found in CRA, but alas I don't get any additional output.

➜  react_app git:(path_edit_remove_objective_patch) ✗ yarn build            
craco:  Project root path resolved to:  /Users/devonjackson/Projects/trainingcamp-django/react_app
craco:  Config file path resolved to:  /Users/devonjackson/Projects/trainingcamp-django/react_app/craco.config.js
craco:  Override started with arguments:  [
  '/Users/devonjackson/.nvm/versions/node/v16.13.2/bin/node',
  '/Users/devonjackson/Projects/trainingcamp-django/react_app/.yarn/__virtual__/@craco-craco-virtual-b3c01b0fb9/0/cache/@craco-craco-npm-6.3.0-4eac7788b6-5644fb65ad.zip/node_modules/@craco/craco/scripts/build.js',
  '--verbose'
]
craco:  For environment:  production
craco:  Found craco config file at:  /Users/devonjackson/Projects/trainingcamp-django/react_app/craco.config.js
craco:  Overrided craco config with plugin.
craco:  Applied craco config plugins.
craco:  Found Webpack prod config at:  /Users/devonjackson/Projects/trainingcamp-django/react_app/.yarn/__virtual__/react-scripts-virtual-4d985aaccd/0/cache/react-scripts-npm-4.0.3-119b1229eb-472d90fabe.zip/node_modules/react-scripts/config/webpack.config.js
craco:  Applied Babel loader options.
craco:  Applied Babel loader options.
craco:  Overrided ESLint config to enable an ignore file.
craco:  Overrided PostCSS loader.
craco:  Overrided PostCSS loader.
craco:  Overrided PostCSS loader.
craco:  Overrided PostCSS loader.
craco:  Merged webpack config with 'webpack.configure'.
craco:  Applied webpack config plugins.
craco:  Overrided require cache for module: /Users/devonjackson/Projects/trainingcamp-django/react_app/.yarn/__virtual__/react-scripts-virtual-4d985aaccd/0/cache/react-scripts-npm-4.0.3-119b1229eb-472d90fabe.zip/node_modules/react-scripts/config/webpack.config.js
craco:  Overrided Webpack prod config.
craco:  Building CRA at:  /Users/devonjackson/Projects/trainingcamp-django/react_app/.yarn/__virtual__/react-scripts-virtual-4d985aaccd/0/cache/react-scripts-npm-4.0.3-119b1229eb-472d90fabe.zip/node_modules/react-scripts/scripts/build.js
Creating an optimized production build...
Compiled successfully.

File sizes after gzip:

  735.88 KB  build/static/js/2.60c75fea.chunk.js
  37.42 KB   build/static/js/main.4546ae10.chunk.js
  3.54 KB    build/static/css/2.75e3c7ae.chunk.css
  1.4 KB     build/static/css/main.28649ee2.chunk.css
  770 B      build/static/js/runtime-main.0ce1aeb1.js

The project was built assuming it is hosted at /.
You can control this with the homepage field in your package.json.

The build folder is ready to be deployed.
You may serve it with a static server:

  yarn global add serve
  serve -s build

Find out more about deployment here:

  https://cra.link/deployment

[stale[bot]]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

[stephane-klein]

I have a more or less related topic, I try to setup bundle-stats in a Craco project.

And I see my output is merging into the webpack config found in CRA, but alas I don't get any additional output.

@devo-devo same issue for me, since February, have you found a solution?

[devo-devo]

@stephane-klein do you have an example config?

i feel like using this secion works a little better

 webpack: {
        configure: (webpackConfig, { env, paths }) => {}
        }
}

[stephane-klein]

@devo-devo my current config:

// craco.config.js
const path = require('path');

const CracoEsbuildPlugin = require('craco-esbuild');

module.exports = {
    plugins: [
        {
            plugin: CracoEsbuildPlugin,
            options: {
                includePaths: [path.resolve(__dirname, '../shared/')]
            }
        }
    ],
    webpack: {
        configure: {
            // this conf come from https://github.com/relative-ci/bundle-stats/tree/master/packages/cli#webpack-configuration
            stats: {
                assets: true,
                chunks: true,
                modules: true,
                builtAt: true,
                hash: true
            }
        }
    }
};

At this time, I look for how can I enable --json option with craco.

I look for enable --json with the webpack config options.

How do you enable --json in your craco project?

[stephane-klein]

I think I have found, I added this lines:

            profile: true,
            recordsPath: path.join(__dirname, 'records.json'),

in:

const path = require('path');

const CracoEsbuildPlugin = require('craco-esbuild');

module.exports = {
    plugins: [
        {
            plugin: CracoEsbuildPlugin,
            options: {
                includePaths: [path.resolve(__dirname, '../shared/')]
            }
        }
    ],
    webpack: {
        configure: {
            // this conf come from https://github.com/relative-ci/bundle-stats/tree/master/packages/cli#webpack-configuration
            profile: true,
            recordsPath: path.join(__dirname, 'records.json'),
            stats: {
                assets: true,
                chunks: true,
                modules: true,
                builtAt: true,
                hash: true
            }
        }
    }
};

[stephane-klein]

I think I have found, I added this lines:

            profile: true,
            recordsPath: path.join(__dirname, 'records.json'),

in:

const path = require('path');

const CracoEsbuildPlugin = require('craco-esbuild');

module.exports = {
    plugins: [
        {
            plugin: CracoEsbuildPlugin,
            options: {
                includePaths: [path.resolve(__dirname, '../shared/')]
            }
        }
    ],
    webpack: {
        configure: {
            // this conf come from https://github.com/relative-ci/bundle-stats/tree/master/packages/cli#webpack-configuration
            profile: true,
            recordsPath: path.join(__dirname, 'records.json'),
            stats: {
                assets: true,
                chunks: true,
                modules: true,
                builtAt: true,
                hash: true
            }
        }
    }
};

Error, records.json isn't a stats file 😥