Minify css in jsp

.production/gulpfile.js

@@ -2,14 +2,15 @@ const gulp = require('gulp')
 const gulpSequence = require('gulp-sequence')
 const babel = require('gulp-babel')
 const uglify = require('gulp-uglify')
-const cleanCss = require('gulp-clean-css')
+const cleancss = require('gulp-clean-css')
 const rename = require('gulp-rename')
 const replace = require('gulp-replace')
 const debug = require('gulp-debug')
-const babelCore = require('@babel/core')
+const BabelCore = require('@babel/core')
 const fs = require('fs')
 const revHash = require('rev-hash')
 const del = require('del')
+const CleanCSS2 = require('clean-css')
 
 // ES6 转码并压缩
 gulp.task('xjs', () => {
@@ -28,7 +29,7 @@ gulp.task('xjs', () => {
 // CSS 压缩
 gulp.task('xcss', () => {
     return gulp.src('../src/main/webapp/assets/css/**/*.css')
-        .pipe(cleanCss())
+        .pipe(cleancss())
         .pipe(debug({ title: 'compress css file : ' }))
         //.pipe(rename({ extname: '.min.css' }))
         .pipe(gulp.dest('./build/assets/css'))
@@ -54,16 +55,11 @@ gulp.task('xjsp', () => {
     return gulp.src('../src/main/webapp/**/*.jsp')
         .pipe(debug({ title: 'compress jsp file : ' }))
         .pipe(replace(/<script type="text\/babel">([\s\S]*)<\/script>/igm, (m, p, o, s) => {
-            if (p.trim().length == 0) return '<!-- No scripts -->'
-            let es5 = ''
-            try {
-                es5 = babelCore.transformSync(p, {
-                    presets: ["@babel/env", "@babel/react"], minified: true
-                }).code
-            } catch (err) {
-                throw new Error('Babel transform :\n' + err)
-            }
-            return '<script>' + es5 + '</script>'
+            if (p.trim().length == 0) return '<!-- No script -->'
+            let min = BabelCore.transformSync(p, {
+                presets: ["@babel/env", "@babel/react"], minified: true
+            }).code
+            return '<script>' + min + '</script>'
         }))
         .pipe(replace(/ type="text\/babel"/ig, '')) // remove type="text/babel"
         .pipe(replace(/<script src="(.*)"><\/script>/ig, (m, p, o, s) => {
@@ -78,6 +74,11 @@ gulp.task('xjsp', () => {
             console.log(p + ' >> ' + file)
             return '<script src="' + file + '"></script>'
         }))
+        .pipe(replace(/<style type="text\/css">([\s\S]*)<\/style>/igm, (m, p, o, s) => {
+            if (p.trim().length == 0) return '<!-- No style -->'
+            let min = new CleanCSS2({}).minify(p).styles
+            return '<style type="text/css">' + min + '</style>'
+        }))
         .pipe(replace(/<link rel="stylesheet" type="text\/css" href="(.*)">/ig, (m, p, o, s) => {
             let file = p
             if (file.includes('/lib/')) return '<link rel="stylesheet" type="text/css" href="' + file + '">'

.production/package.json

@@ -28,6 +28,7 @@
         "gulp-replace": "^1.0.0",
         "gulp-sequence": "^1.0.0",
         "gulp-uglify": "^3.0.1",
-        "rev-hash": "^2.0.0"
+        "rev-hash": "^2.0.0",
+        "clean-css": "^4.2.1"
     }
 }