Can't disable hashing from build

[ram33]

Version

3.0.0-rc.3

Steps to reproduce

Have tried below two options as suggested in docs... but doesn't seem to work

//vue.config.js

module.exports = {
  chainWebpack: config => {
    config
      .plugin('html')
      .tap(args => {
        args[0].hash = false;
        return args
      })
  }
}

module.exports = {
  chainWebpack: config => {
    config
      .plugin('html')
      .tap(args => [{
        hash: false
      }])
  }
}

What is expected?

Was expecting output file name to be just app.css instead of app.########.css

What is actually happening?

I am getting app.########.css

[yyx990803]

Use

• '[name].js' for output.filename and output.chunkFilename in chainWebpack
• { filename: '[name].css' } for css.extract option in vue.config.js.

[Akryum]

Try:

// vue.config.js
module.exports = {
  chainWebpack: config => {
    if(config.plugins.has('extract-css')) {
      const extractCSSPlugin = config.plugin('extract-css')
      extractCSSPlugin && extractCSSPlugin.tap(() => [{
        filename: '[name].css',
        chunkFilename: '[name].css'
      }])
    }
  },
  configureWebpack: {
    output: {
      filename: '[name].js',
      chunkFilename: '[name].js'
    }
  }
}

[ram33]

@yyx990803 @Akryum That worked... Thank you.

[pedroresende]

@Akryum This should really go into documentation, it would help a lot of people.

[Akryum]

@yyx990803 Maybe we can add a "Common recipes" page in the docs?

[DrSensor]

How to disable filenameHashing on a specific file/chunk?
I have a case to disable the hashing for only each of theme.scss

[benlind]

Evan's solution looks like this in vue.config.js:

module.exports = {
  configureWebpack: config => {
    config.output.filename = '[name].js'
    config.output.chunkFilename = '[name].js'
  },
  css: {
    extract: {
      filename: '[name].css',
    },
  },
}

[ffxsam]

Just adding this here, to keep people up to date. This is now an option in vue.config.js:

https://cli.vuejs.org/config/#filenamehashing

[kambanwait]

Try:
> js
> // vue.config.js
> module.exports = {
> chainWebpack: config => {
> if(config.plugins.has('extract-css')) {
> const extractCSSPlugin = config.plugin('extract-css')
> extractCSSPlugin && extractCSSPlugin.tap(() => [{
> filename: '[name].css',
> chunkFilename: '[name].css'
> }])
> }
> },
> configureWebpack: {
> output: {
> filename: '[name].js',
> chunkFilename: '[name].js'
> }
> }
> }
Not sure where this should be added but this defo needs to be in the docs for Vue CLI that's easy to find. I spent ages trying to work out why this didn't work using the following: https://cli.vuejs.org/guide/css.html#css-modules

Just as I wrote the above I saw this comment! Much better!

Just adding this here, to keep people up to date. This is now an option in vue.config.js:

https://cli.vuejs.org/config/#filenamehashing