zoukankan      html  css  js  c++  java
  • 压缩 css

    npm install --save-dev optimize-css-assets-webpack-plugin

    webpack配置:

    const { resolve } = require('path');
    const HtmlWebpackPlugin = require('html-webpack-plugin');
    const MiniCssExtractPlugin = require('mini-css-extract-plugin');
    const OptimizeCssAssetsWebpackPlugin = require('optimize-css-assets-webpack-plugin')
    
    // 设置nodejs环境变量
    // process.env.NODE_ENV = 'development';
    
    module.exports = {
      entry: './src/js/index.js',
      output: {
        filename: 'js/built.js',
        path: resolve(__dirname, 'build')
      },
      module: {
        rules: [
          {
            test: /.css$/,
            use: [
              MiniCssExtractPlugin.loader,
              'css-loader',
              {
                loader: 'postcss-loader',
                options: {
                  ident: 'postcss',
                  plugins: () => [
                    // postcss的插件
                    require('postcss-preset-env')()
                  ]
                }
              }
            ]
          }
        ]
      },
      plugins: [
        new HtmlWebpackPlugin({
          template: './src/index.html'
        }),
        new MiniCssExtractPlugin({
          filename: 'css/built.css'
        }),
        // 压缩css
        new OptimizeCssAssetsWebpackPlugin()
      ],
      mode: 'development'
    };

    压缩后的 bundle.css

  • 相关阅读:
    2-反向调试
    1-断点调试
    gdb基础用法
    protobuf学习手册(上)
    1024 科学计数法 (20 分)
    1023 组个最小数 (20 分)
    1018 锤子剪刀布 (20 分)
    1015 德才论 (25 分)
    1020 月饼 (25 分)
    1019 数字黑洞 (20 分)
  • 原文地址:https://www.cnblogs.com/shanlu0000/p/13048162.html
Copyright © 2011-2022 走看看