Açısal kısaltma kullanılmayan css'yi kaldırabilir mi? Ben açısal cli ile oluşturabilir

Question

kadar küçük demet oluşturma işlemi aynı zamanda, örneğin kullanılmayan CSS sınıfları kaldırır olmadığını merak

-prod --aot doğru

ng yapı çalıştırarak olduğu bootstrap gelen?

nasıl ben buna purifycss gibi kütüphaneler ekleyebilir Değilse?

Alkış

Answer 1

sonra bunu olarak yapabilirsiniz web paketi kullanıyorsanız: -

Öncelikle purifycss-webpackusing npm i -D purifycss-webpack

module.export={ 
    plugins: [ 
    new ExtractTextPlugin('[name].[contenthash].css'), 
    // Make sure this is after ExtractTextPlugin! 
    new PurifyCSSPlugin({ 
     // Give paths to parse for rules. These should be absolute! 
     paths: glob.sync(path.join(__dirname, 'app/*.html')), 
    }) 
    ] 

}; 

ziyaret edin Bu detaylı anlaşılması için aşağıdaki bağlantıyı kurun. Eğer dışarı atılır ise

https://github.com/webpack-contrib/purifycss-webpack

Answer 2

, yani ng eject. Sonra webpack yapısını birçok şeyi yapmak için özelleştirebilirsiniz. İki eklentide, minifyCSS ile yapının bir parçası olarak stilleri en aza indirmek için birkaç seçeneğim var.

1. LoaderOptionsPlugin

   new LoaderOptionsPlugin({ 
       "sourceMap": false, 
       "options": { 
       "html-minifier-loader": { 
        "removeComments": true, 
        "collapseWhitespace": true, 
        "conservativeCollapse": true, 
        "preserveLineBreaks": true, 
        "caseSensitive": true, 
        "minifyCSS": true 
       }, 
   

2. HtmlWebpackPlugin

   new HtmlWebpackPlugin({ 
       "template": "./src\\index.ejs", 
       "filename": "./index.html", 
       "hash": true, 
       "inject": true, 
       "compile": true, 
       "favicon": 'src/assets/Flag.png', 
       "minify": { 
        collapseWhitespace: true, 
        removeComments: true, 
        minifyCSS: true 
       },