Next.js: How add [hash] for .js .css and other files in build?

Created on 14 May 2018  路  6Comments  路  Source: vercel/next.js

I want add [name]__[hash]__.[ext] for .js .css and other files in build

For example in webpack i have file-loader and i have

options: {
              name: '[name]__[hash]__.[ext]',
              publicPath: '...',
              outputPath: '...',
            },

How do same in next.config.js? Or nextjs do hashing files when build?

| Tech | Version |
|---------|---------|
| next | 5.1.0 |
| node | 10.0.0 |

All 6 comments

it working but look like as shi~

const nextConfiguration = {
  webpack: (config, { dev, buildId }) => {
    if (!dev) {
      const nextExtractTextPlugin = config.plugins.find(
        element => element.__proto__.constructor.name === 'ExtractTextPlugin'
      );
      nextExtractTextPlugin.filename = `static/style.${buildId}.css`;
      config.plugins.push(nextDefinePlugin(buildId), nextCleanWebpackPlugin);
      return config;
    }
    config.plugins.push(nextDefinePlugin);
    return config;
  }
};

Doesn't seem like a Next.js issue. Maybe you're using one of the next-plugins, in that case file it there. Also, when creating issues, please follow the issue template.

@timneutkens what about extractCSSPlugin in context webpack: (config, context) => {
how i can manipulate it

@timneutkens nextjs do hashing files when build?

@timneutkens do u answer me?

@Popugune The issue tracker is to report bugs in Next.js, not to ask for support. You can try asking your question on Spectrum.

It looks like you're on the right track with your nextConfiguration above.

Was this page helpful?
0 / 5 - 0 ratings