CSS自動(dòng)版本號(hào)是指通過(guò)腳本自動(dòng)更新CSS文件的版本號(hào)，以實(shí)現(xiàn)緩存控制和更新問(wèn)題。在前端開發(fā)中，為了加速頁(yè)面訪問(wèn)速度，往往會(huì)利用瀏覽器緩存技術(shù)。然而，由于瀏覽器會(huì)緩存靜態(tài)資源，靜態(tài)資源更新后新的版本在訪問(wèn)舊的版本時(shí)可能會(huì)導(dǎo)致頁(yè)面出現(xiàn)問(wèn)題。

為了解決這個(gè)問(wèn)題，往往我們需要在CSS文件的鏈接中添加版本號(hào)。這樣在CSS文件更新后，新版本的CSS文件鏈接與舊版本的CSS文件鏈接不同，從而瀏覽器緩存失效，新版本的CSS文件能夠被正確加載。

實(shí)現(xiàn)CSS自動(dòng)版本號(hào)的一種方式是通過(guò)構(gòu)建工具（如Webpack）和插件（如webpack-md5-hash）來(lái)實(shí)現(xiàn)，這個(gè)插件會(huì)根據(jù)文件內(nèi)容為輸出的文件生成唯一的hash值。使得文件內(nèi)容改變后，打包后的文件名也會(huì)隨之改變，而且只有當(dāng)文件內(nèi)容發(fā)生了改變，hash值才會(huì)變化。這樣在引用靜態(tài)文件時(shí)就可以把hash值插入到文件名中，以實(shí)現(xiàn)文件更新緩存失效。

// webpack.config.js
const path = require('path');
const webpack = require('webpack');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const WebpackMd5Hash = require('webpack-md5-hash');
module.exports = {
entry: {
main: './src/index.js'
},
output: {
path: path.resolve(__dirname, 'dist'),
filename: '[name].[chunkhash].js'
},
module: {...},
plugins: [
new HtmlWebpackPlugin({
template: './src/index.html',
filename: 'index.html'
}),
new WebpackMd5Hash()
]
};

在上面的代碼中，WebpackMd5Hash插件會(huì)為生成的文件自動(dòng)添加hash值。通過(guò)這種方式，可以自動(dòng)實(shí)現(xiàn)CSS文件的版本號(hào)更新，以確保靜態(tài)資源能夠成功更新緩存。