⬆️ ➕ plugins and ✨ configs

.npmignore

@@ -3,4 +3,5 @@
 /plugins/*
 !/plugins/flot-old/
 /.github/
+/.temp/
 /.lgtm.yml

gulpfile.js

@@ -3,16 +3,18 @@
 const autoprefix = require('autoprefixer')
 const browserSync = require('browser-sync').create()
 const del = require('del')
-const { src, dest, lastRun, watch, series } = require('gulp')
+const { src, dest, lastRun, watch, series, parallel } = require('gulp')
 const cleanCss = require('gulp-clean-css')
 const eslint = require('gulp-eslint-new')
 const fileinclude = require('gulp-file-include')
+const validator = require('gulp-html')
 const gulpIf = require('gulp-if')
 const npmDist = require('gulp-npm-dist')
 const postcss = require('gulp-postcss')
 const rename = require('gulp-rename')
 const sass = require('gulp-sass')(require('sass'))
 const gulpStylelint = require('gulp-stylelint')
+const terser = require('gulp-terser')
 const rollup = require('rollup')
 const rollupTypescript = require('@rollup/plugin-typescript')
 const rtlcss = require('rtlcss')
@@ -71,6 +73,15 @@ const postcssRtlOptions = [
 
 // From here Dev mode will Start
 
+// Lint SCSS
+const lintScss = () => src([paths.src.scss + '/**/*.scss'], { since: lastRun(lintScss) })
+    .pipe(gulpStylelint({
+      failAfterError: false,
+      reporters: [
+        { formatter: 'string', console: true }
+      ]
+    }))
+
 // Compile SCSS
 const scss = () => src(paths.src.scss + '/adminlte.scss', { sourcemaps: true })
     .pipe(sass(sassOptions).on('error', sass.logError))
@@ -85,15 +96,19 @@ const scssDark = () => src(paths.src.scss + '/dark/adminlte-dark-addon.scss', {
     .pipe(dest(paths.temp.css + '/dark', { sourcemaps: '.' }))
     .pipe(browserSync.stream())
 
-// Lint SCSS
+// Lint TS
-const lintScss = () => src([paths.src.scss + '/**/*.scss'], { since: lastRun(lintScss) })
+function isFixed(file) {
-    .pipe(gulpStylelint({
+  // Has ESLint fixed the file contents?
-      failAfterError: false,
+  return file.eslint !== null && file.eslint.fixed
-      reporters: [
+}
-        { formatter: 'string', console: true }
-      ]
-    }))
 
+const lintTs = () => src([paths.src.ts + '/**/*.ts'], { since: lastRun(lintTs) })
+    .pipe(eslint({ fix: true }))
+    .pipe(eslint.format())
+    .pipe(gulpIf(isFixed, dest(paths.src.ts)))
+    .pipe(eslint.failAfterError())
+
+// Compile TS
 const tsCompile = () =>
   rollup.rollup({
     input: paths.src.ts + '/adminlte.ts',
@@ -110,17 +125,9 @@ const tsCompile = () =>
     sourcemap: true
   }))
 
-// Lint TS
+const assets = () => src([paths.src.assets])
-function isFixed(file) {
+    .pipe(dest(paths.temp.assets))
-  // Has ESLint fixed the file contents?
+    .pipe(browserSync.stream())
-  return file.eslint !== null && file.eslint.fixed
-}
-
-const lintTs = () => src([paths.src.ts + '/**/*.ts'], { since: lastRun(lintTs) })
-    .pipe(eslint({ fix: true }))
-    .pipe(eslint.format())
-    .pipe(gulpIf(isFixed, dest(paths.src.ts)))
-    .pipe(eslint.failAfterError())
 
 const index = () => src([paths.src.base + '*.html'])
     .pipe(fileinclude({
@@ -144,9 +151,8 @@ const html = () => src([paths.src.html])
     .pipe(dest(paths.temp.html))
     .pipe(browserSync.stream())
 
-const assets = () => src([paths.src.assets])
+const lintHtml = () => src([paths.temp.html + '/**/*.html', paths.src.base + '*.html'])
-    .pipe(dest(paths.temp.assets))
+    .pipe(validator())
-    .pipe(browserSync.stream())
 
 const vendor = () => src(npmDist({ copyUnminified: true }), { base: paths.src.nodeModules })
     .pipe(dest(paths.temp.vendor))
@@ -160,48 +166,23 @@ const serve = () => {
   watch([paths.src.scss + '/**/*.scss', '!' + paths.src.scss + '/bootstrap-dark/**/*.scss', '!' + paths.src.scss + '/dark/**/*.scss'], series(scss))
   watch([paths.src.scss + '/bootstrap-dark/', paths.src.scss + '/dark/'], series(scssDark))
   watch([paths.src.ts], series(lintTs, tsCompile))
-  watch([paths.src.html, paths.src.base + '*.html', paths.src.partials], series(html, index))
+  watch([paths.src.html, paths.src.base + '*.html', paths.src.partials], series(html, index, lintHtml))
   watch([paths.src.assets], series(assets))
 }
 
 // From here Dist will Start
 
-// Minify CSS
-const minifyDistCss = () => src([
-  paths.dist.css + '/**/*.css'
-], {
-  base: paths.dist.css,
-  sourcemaps: true
-})
-    .pipe(cleanCss({ format: { breakWith: 'lf' } }))
-    .pipe(rename({ suffix: '.min' }))
-    .pipe(dest(paths.dist.css, { sourcemaps: '.' }))
-
-// Minify JS
-// Need to add terser
-const minifyDistJs = () =>
-  rollup.rollup({
-    input: paths.src.ts + '/adminlte.ts',
-    output: {
-      banner
-    },
-    plugins: [
-      rollupTypescript()
-    ]
-  }).then(bundle => bundle.write({
-    file: paths.dist.js + '/adminlte.js',
-    format: 'umd',
-    name: 'adminlte',
-    sourcemap: true
-  }))
-
-// Copy assets
-const copyDistAssets = () => src(paths.src.assets)
-    .pipe(dest(paths.dist.assets))
-
 // Clean
 const cleanDist = () => del([paths.dist.base])
 
+const lintDistScss = () => src([paths.src.scss + '/**/*.scss'])
+    .pipe(gulpStylelint({
+      failAfterError: false,
+      reporters: [
+        { formatter: 'string', console: true }
+      ]
+    }))
+
 // Compile and copy all scss/css
 const copyDistCssAll = () => src([paths.src.scss + '/**/*.scss'], {
   base: paths.src.scss,
@@ -216,6 +197,21 @@ const copyDistCssRtl = () => src(paths.dist.css + '/*.css', { sourcemaps: true }
     .pipe(rename({ suffix: '.rtl' }))
     .pipe(dest(paths.dist.css + '/rtl', { sourcemaps: '.' }))
 
+// Minify CSS
+const minifyDistCss = () => src([
+  paths.dist.css + '/**/*.css'
+], {
+  base: paths.dist.css,
+  sourcemaps: true
+})
+    .pipe(cleanCss({ format: { breakWith: 'lf' } }))
+    .pipe(rename({ suffix: '.min' }))
+    .pipe(dest(paths.dist.css, { sourcemaps: '.' }))
+
+const lintDistTs = () => src([paths.src.ts + '/**/*.ts'])
+    .pipe(eslint())
+    .pipe(eslint.failAfterError())
+
 // Compile and copy ts/js
 const copyDistJs = () =>
   rollup.rollup({
@@ -233,16 +229,21 @@ const copyDistJs = () =>
     sourcemap: true
   }))
 
-// Copy Html
+// Minify JS
-const copyDistHtml = () => src([paths.src.html])
+// Need to add terser
-    .pipe(fileinclude({
+const minifyDistJs = () =>
-      prefix: '@@',
+  src(paths.dist.js + '/adminlte.js', { sourcemaps: true })
-      basepath: './src/partials/',
+    .pipe(terser({
-      context: {
+      compress: {
-        environment: 'production'
+        passes: 2
-      }
+      },
+      comments: '/^!/'
     }))
-    .pipe(dest(paths.dist.html))
+    .pipe(dest(paths.dist.js + '/adminlte.min.js'))
+
+// Copy assets
+const copyDistAssets = () => src(paths.src.assets)
+    .pipe(dest(paths.dist.assets))
 
 // Copy index
 const copyDistHtmlIndex = () => src([paths.src.base + '*.html'])
@@ -255,12 +256,49 @@ const copyDistHtmlIndex = () => src([paths.src.base + '*.html'])
     }))
     .pipe(dest(paths.dist.base))
 
+// Copy Html
+const copyDistHtml = () => src([paths.src.html])
+    .pipe(fileinclude({
+      prefix: '@@',
+      basepath: './src/partials/',
+      context: {
+        environment: 'production'
+      }
+    }))
+    .pipe(dest(paths.dist.html))
+
+const lintDistHtml = () => src([paths.temp.html + '/**/*.html', paths.src.base + '*.html'])
+    .pipe(validator())
+
 // Copy node_modules to vendor
 const copyDistVendor = () => src(npmDist({ copyUnminified: true }), { base: paths.src.nodeModules })
     .pipe(dest(paths.dist.vendor))
 
-// To Dist Before release
+const lint = parallel(
-exports.build = series(lintScss, lintTs, cleanDist, copyDistCssAll, copyDistCssRtl, minifyDistCss, copyDistJs, minifyDistJs, copyDistHtml, copyDistHtmlIndex, copyDistAssets, copyDistVendor)
+  lintDistScss,
+  lintDistTs,
+  series(copyDistHtmlIndex, copyDistHtml, lintDistHtml)
+)
+exports.lint = lint
+
+const compile = series(
+  cleanDist,
+  parallel(
+    series(
+      parallel(copyDistCssAll, copyDistCssRtl),
+      minifyDistCss
+    ),
+    series(copyDistJs, minifyDistJs),
+    copyDistAssets,
+    copyDistHtmlIndex,
+    copyDistHtml,
+    copyDistVendor
+  )
+)
+exports.compile = compile
+
+// For Production Release
+exports.production = series(lint, compile)
 
 // Default - Only for light mode AdminLTE
 exports.default = series(scss, scssDark, tsCompile, html, index, assets, vendor, serve)

package.json

@@ -7,7 +7,11 @@
   "main": "dist/js/adminlte.min.js",
   "scripts": {
     "bundlewatch": "bundlewatch --config .bundlewatch.config.json",
-    "lockfile-lint": "lockfile-lint --allowed-hosts npm --allowed-schemes https: --empty-hostname false --type npm --path package-lock.json"
+    "lockfile-lint": "lockfile-lint --allowed-hosts npm --allowed-schemes https: --empty-hostname false --type npm --path package-lock.json",
+    "docs": "echo 1",
+    "lint": "npx gulp lint && lockfile-lint",
+    "compile": "npx gulp compile",
+    "production": "npx gulp production"
   },
   "keywords": [
     "css",
@@ -39,32 +43,34 @@
   },
   "devDependencies": {
     "@rollup/plugin-typescript": "^8.3.0",
-    "@typescript-eslint/eslint-plugin": "^5.0.0",
+    "@typescript-eslint/eslint-plugin": "^5.3.0",
-    "@typescript-eslint/parser": "^5.0.0",
+    "@typescript-eslint/parser": "^5.3.0",
-    "autoprefixer": "^10.3.7",
+    "autoprefixer": "^10.4.0",
-    "browser-sync": "^2.27.5",
+    "browser-sync": "^2.27.7",
     "bundlewatch": "^0.3.2",
     "del": "^6.0.0",
     "eslint": "^8.0.1",
     "eslint-config-xo": "^0.39.0",
-    "eslint-config-xo-typescript": "^0.45.2",
+    "eslint-config-xo-typescript": "^0.47.1",
     "eslint-plugin-import": "^2.25.2",
     "eslint-plugin-unicorn": "^37.0.1",
     "gulp": "^4.0.2",
     "gulp-clean-css": "^4.3.0",
-    "gulp-eslint-new": "^0.4.0",
+    "gulp-eslint-new": "^0.5.1",
     "gulp-file-include": "^2.3.0",
+    "gulp-html": "^3.5.0",
     "gulp-if": "^3.0.0",
     "gulp-npm-dist": "^1.0.3",
     "gulp-postcss": "^9.0.1",
     "gulp-rename": "^2.0.0",
     "gulp-sass": "^5.0.0",
     "gulp-stylelint": "^13.0.0",
+    "gulp-terser": "^2.1.0",
     "lockfile-lint": "^4.6.2",
     "postcss": "^8.3.9",
-    "rollup": "^2.58.0",
+    "rollup": "^2.59.0",
-    "rtlcss": "^3.3.0",
+    "rtlcss": "^3.5.0",
-    "sass": "^1.42.1",
+    "sass": "^1.43.4",
     "stylelint": "^13.13.1",
     "stylelint-config-twbs-bootstrap": "^2.2.4",
     "typescript": "^4.4.4"