diff --git a/docs/config/README.md b/docs/config/README.md index 5c4c6e38ca..b2a6f720a8 100644 --- a/docs/config/README.md +++ b/docs/config/README.md @@ -245,22 +245,9 @@ See [the plugin's README](https://github.com/vuejs/vue-cli/blob/dev/packages/%40 ### css.modules -Deprecated since v4, please use [`css.requireModuleExtension`](#css-requireModuleExtension) instead. - -In v3 this means the opposite of `css.requireModuleExtension`. - ### css.requireModuleExtension -- Type: `boolean` -- Default: `true` - - By default, only files that ends in `*.module.[ext]` are treated as CSS modules. Setting this to `false` will allow you to drop `.module` in the filenames and treat all `*.(css|scss|sass|less|styl(us)?)` files as CSS modules. - - ::: tip - If you have customized CSS Modules configurations in `css.loaderOptions.css`, then the `css.requireModuleExtension` field must be explicitly configured to `true` or `false`, otherwise we can't be sure whether you want to apply these options to all CSS files or not. - ::: - - See also: [Working with CSS > CSS Modules](../guide/css.md#css-modules) +Both removed in v5, see [Working with CSS > CSS Modules](../guide/css.md#css-modules) for guidance on how to treat all style imports as CSS Modules. ### css.extract diff --git a/docs/guide/css.md b/docs/guide/css.md index a8f297224d..bffbddd4e9 100644 --- a/docs/guide/css.md +++ b/docs/guide/css.md @@ -81,7 +81,7 @@ In the production build, Vue CLI optimizes your CSS and will drop unnecessary ve You can [use CSS Modules in `*.vue` files](https://vue-loader.vuejs.org/en/features/css-modules.html) out of the box with ` +`) + await project.write('src/style.module.css', `.green { color: green; }\n`) + await project.write('src/style.css', `.yellow { color: yellow; }\n`) + + const { stdout } = await project.run('vue-cli-service build') + + expect(stdout).toMatch('Build complete.') + + const appCss = await project.read('dist/css/app.css') + + // +`) + await project.write('src/style.module.css', `.green { color: green; }\n`) + await project.write('src/style.css', `.yellow { color: yellow; }\n`) + + // disable CSS Modules + await project.write( + 'vue.config.js', + `module.exports = { + filenameHashing: false, + css: { + loaderOptions: { + css: { + modules: false + } + } + } + }` + ) + let { stdout } = await project.run('vue-cli-service build') + expect(stdout).toMatch('Build complete.') + let appCss = await project.read('dist/css/app.css') + + //