javascript - Webpack regroupe-t-il les fichiers CSS au format lien ou au format style?

Question

Concernant le style requis, il est présenté sous forme de balise de lien ou sous forme de <style>. Webpack fournit extract-text-webpack-plugin pour extraire le style css dans le style.

Si mis en œuvre comme suit :

webpack打包部分代码：
                {
                    test:/\.LK\.css$/,
                    loader:"style-loader/url!file-loader?name=css/[name].            
                    [hash:8].css!autoprefixer-loader?browsers=last 5 versions",
                    exclude:/node_modules/
        },
        {
                    test:/([^\.][^L][^K])\.css$/,  //抱歉，正则写的不是很严谨
                    loader:"style-loader!css-loader!autoprefixer-loader?{ browsers: ['last 100 versions'] }",
                    exclude:/node_modules/
        }
        

De cette façon, lorsque le style CSS se termine par .LK.css, il sera intégré dans la page sous la forme d'un lien. Après un simple test, cette solution peut essentiellement réaliser la fonction. Parce que la recherche sur webpack n'est pas très approfondie, j'aimerais savoir si une telle solution peut être appliquée au développement réel ?

Answer 1

Oui, notamment dans la pile technologique React/Vue, cela peut être introduit comme une méthode d'optimisation nécessaire.

Après avoir extrait le CSS vers des fichiers statiques, le temps d'analyse peut être réduit de moitié par rapport à la solution JS-in-CSS. Ce plug-in prend également en charge le suffixe Hash et d'autres fonctions, et ses capacités sont suffisantes pour une utilisation dans des environnements de production.