Skip to content

Commit

Permalink
[docs][webpack] Use hash in CSS filename (#472)
Browse files Browse the repository at this point in the history
* Use hash in CSS filename

* Add better explanation of
  • Loading branch information
Daniel15 authored and thymikee committed Aug 12, 2019
1 parent 7e326c3 commit 4acde48
Showing 1 changed file with 10 additions and 0 deletions.
10 changes: 10 additions & 0 deletions docs/BUNDLERS_INTEGRATION.md
Expand Up @@ -73,6 +73,16 @@ This will extract the CSS from all files into a single `styles.css`. Then you ca

It will also hot reload your styles when in a development environment.

For production usage, you should include a hash in the filename:

```js
new MiniCssExtractPlugin({
filename: 'styles-[contenthash].css',
});
```

Using a hash like this allows for a far future `Expires` header to be used, to improve cache efficiency. To link to the correct filename, you can either use [`HTMLWebpackPlugin`](https://github.com/jantimon/html-webpack-plugin) for a static HTML file, or [`assets-webpack-plugin`](https://yarn.pm/assets-webpack-plugin) to save the filename to a JSON file which you can then read in your server-side code.

Linaria integrates with your CSS pipeline, so you can always perform additional operations on the CSS, for example, using [postcss](https://postcss.org/) plugins such as [clean-css](https://github.com/jakubpawlowicz/clean-css) to further minify your CSS.

#### Full example
Expand Down

0 comments on commit 4acde48

Please sign in to comment.