mirror of https://github.com/ColorlibHQ/AdminLTE
added gulp build
Daniel
parent
be71fb2963
commit
e90d2c133c
110
gulpfile.js
110
gulpfile.js
|
|
@ -3,7 +3,6 @@
|
|||
/* eslint-disable no-undef */
|
||||
/* eslint-disable unicorn/prefer-module */
|
||||
|
||||
// const autoprefixer = require('autoprefixer')
|
||||
const browserSync = require('browser-sync').create()
|
||||
const cleanCss = require('gulp-clean-css')
|
||||
const del = require('del')
|
||||
|
|
@ -12,12 +11,12 @@ const npmDist = require('gulp-npm-dist')
|
|||
const sass = require('gulp-sass')
|
||||
const wait = require('gulp-wait')
|
||||
const postcss = require('gulp-postcss')
|
||||
// const rtlcss = require('rtlcss')
|
||||
const rename = require('gulp-rename')
|
||||
const sourcemaps = require('gulp-sourcemaps')
|
||||
const fileinclude = require('gulp-file-include')
|
||||
|
||||
const esbuild = require('esbuild')
|
||||
// const { getTarget } = require('./get.browserslist.target')
|
||||
|
||||
sass.compiler = require('sass')
|
||||
|
||||
const pkg = require('./package')
|
||||
const year = new Date().getFullYear()
|
||||
|
|
@ -64,7 +63,12 @@ const paths = {
|
|||
}
|
||||
}
|
||||
|
||||
function postcssCallback() {
|
||||
const sassOptions = {
|
||||
outputStyle: 'expanded',
|
||||
includePaths: ['./node_modules/']
|
||||
}
|
||||
|
||||
function postcssOptions() {
|
||||
return {
|
||||
map: {
|
||||
inline: false,
|
||||
|
|
@ -79,16 +83,29 @@ function postcssCallback() {
|
|||
}
|
||||
}
|
||||
|
||||
function postcssRtlOptions() {
|
||||
return {
|
||||
map: {
|
||||
inline: false,
|
||||
annotation: true,
|
||||
sourcesContent: true
|
||||
},
|
||||
plugins: [
|
||||
require('autoprefixer')({
|
||||
cascade: false
|
||||
}),
|
||||
require('rtlcss')({})
|
||||
]
|
||||
}
|
||||
}
|
||||
|
||||
// Compile SCSS
|
||||
gulp.task('scss', () => {
|
||||
return gulp.src(paths.src.scss + '/adminlte.scss')
|
||||
.pipe(wait(500))
|
||||
.pipe(sourcemaps.init())
|
||||
.pipe(sass({
|
||||
outputStyle: 'expanded',
|
||||
includePaths: ['./node_modules/']
|
||||
}).on('error', sass.logError))
|
||||
.pipe(postcss(postcssCallback))
|
||||
.pipe(sass(sassOptions).on('error', sass.logError))
|
||||
.pipe(postcss(postcssOptions))
|
||||
.pipe(sourcemaps.write('.'))
|
||||
.pipe(gulp.dest(paths.temp.css))
|
||||
.pipe(browserSync.stream())
|
||||
|
|
@ -101,7 +118,6 @@ gulp.task('ts', () => {
|
|||
js: banner
|
||||
},
|
||||
bundle: true,
|
||||
color: true,
|
||||
format: 'iife',
|
||||
sourcemap: true,
|
||||
target: ['chrome60'],
|
||||
|
|
@ -161,14 +177,31 @@ gulp.task('serve', gulp.series('scss', 'ts', 'html', 'index', 'assets', 'vendor'
|
|||
}))
|
||||
|
||||
// Minify CSS
|
||||
gulp.task('minify:css', () => {
|
||||
gulp.task('minify:dist:css', () => {
|
||||
return gulp.src([
|
||||
paths.dist.css + '/adminlte.css'
|
||||
])
|
||||
paths.dist.css + '/**/*.css'
|
||||
], { base: paths.dist.css })
|
||||
.pipe(sourcemaps.init({ loadMaps: true }))
|
||||
.pipe(cleanCss())
|
||||
.pipe(rename({ suffix: '.min' }))
|
||||
.pipe(sourcemaps.write('.'))
|
||||
.pipe(gulp.dest(paths.dist.css))
|
||||
})
|
||||
|
||||
// Minify JS
|
||||
gulp.task('minify:dist:js', () => {
|
||||
return esbuild.build({
|
||||
entryPoints: [paths.dist.js + '/adminlte.js'],
|
||||
format: 'iife',
|
||||
minify: true,
|
||||
sourcemap: true,
|
||||
target: ['chrome60'],
|
||||
outfile: paths.dist.js + '/adminlte.min.js'
|
||||
}).catch(
|
||||
error => console.error(error)
|
||||
)
|
||||
})
|
||||
|
||||
// Copy assets
|
||||
gulp.task('copy:dist:assets', () => {
|
||||
return gulp.src(paths.src.assets)
|
||||
|
|
@ -185,15 +218,52 @@ gulp.task('copy:dist:css', () => {
|
|||
return gulp.src([paths.src.scss + '/adminlte.scss'])
|
||||
.pipe(wait(500))
|
||||
.pipe(sourcemaps.init())
|
||||
.pipe(sass({
|
||||
outputStyle: 'expanded',
|
||||
includePaths: ['./node_modules/']
|
||||
}).on('error', sass.logError))
|
||||
.pipe(postcss(postcssCallback))
|
||||
.pipe(sass(sassOptions).on('error', sass.logError))
|
||||
.pipe(postcss(postcssOptions))
|
||||
.pipe(sourcemaps.write('.'))
|
||||
.pipe(gulp.dest(paths.dist.css))
|
||||
})
|
||||
|
||||
gulp.task('copy:dist:css:dark', () => {
|
||||
return gulp.src([paths.src.scss + '/dark/*.scss'])
|
||||
.pipe(wait(500))
|
||||
.pipe(sourcemaps.init())
|
||||
.pipe(sass(sassOptions).on('error', sass.logError))
|
||||
.pipe(postcss(postcssOptions))
|
||||
.pipe(sourcemaps.write('.'))
|
||||
.pipe(gulp.dest(paths.dist.css + '/dark'))
|
||||
})
|
||||
|
||||
gulp.task('copy:dist:css:rtl', () => {
|
||||
return gulp.src([
|
||||
paths.dist.css + '/*.css',
|
||||
paths.dist.css + '/dark/*.css'
|
||||
])
|
||||
.pipe(wait(500))
|
||||
.pipe(sourcemaps.init({ loadMaps: true }))
|
||||
.pipe(postcss(postcssRtlOptions))
|
||||
.pipe(rename({ suffix: '.rtl' }))
|
||||
.pipe(sourcemaps.write('.'))
|
||||
.pipe(gulp.dest(paths.dist.css + '/rtl'))
|
||||
})
|
||||
|
||||
// Compile and copy ts/js
|
||||
gulp.task('copy:dist:js', () => {
|
||||
return esbuild.build({
|
||||
entryPoints: [paths.src.ts + '/adminlte.ts'],
|
||||
banner: {
|
||||
js: banner
|
||||
},
|
||||
bundle: true,
|
||||
format: 'iife',
|
||||
sourcemap: true,
|
||||
target: ['chrome60'],
|
||||
outfile: paths.dist.js + '/adminlte.js'
|
||||
}).catch(
|
||||
error => console.error(error)
|
||||
)
|
||||
})
|
||||
|
||||
// Copy Html
|
||||
gulp.task('copy:dist:html', () => {
|
||||
return gulp.src([paths.src.html])
|
||||
|
|
@ -226,7 +296,7 @@ gulp.task('copy:dist:vendor', () => {
|
|||
.pipe(gulp.dest(paths.dist.vendor))
|
||||
})
|
||||
|
||||
gulp.task('build', gulp.series('clean:dist', 'copy:dist:css', 'copy:dist:html', 'copy:dist:html:index', 'copy:dist:assets', 'copy:dist:vendor'))
|
||||
gulp.task('build', gulp.series('clean:dist', 'copy:dist:css', 'copy:dist:css:dark', 'copy:dist:css:rtl', 'minify:dist:css', 'copy:dist:js', 'minify:dist:js', 'copy:dist:html', 'copy:dist:html:index', 'copy:dist:assets', 'copy:dist:vendor'))
|
||||
|
||||
// Default
|
||||
gulp.task('default', gulp.series('serve'))
|
||||
|
|
|
|||
|
|
@ -3021,9 +3021,9 @@
|
|||
}
|
||||
},
|
||||
"esbuild": {
|
||||
"version": "0.11.21",
|
||||
"resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.11.21.tgz",
|
||||
"integrity": "sha512-FqpYdJqiTeLDbj3vqxc/fG8UmHIEvQrDaUxSw1oJf4giLd/tnMDUUlXellCjOab7qGKQ5hUFD5eQgmO+tkZeow==",
|
||||
"version": "0.11.23",
|
||||
"resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.11.23.tgz",
|
||||
"integrity": "sha512-iaiZZ9vUF5wJV8ob1tl+5aJTrwDczlvGP0JoMmnpC2B0ppiMCu8n8gmy5ZTGl5bcG081XBVn+U+jP+mPFm5T5Q==",
|
||||
"dev": true
|
||||
},
|
||||
"escalade": {
|
||||
|
|
@ -5149,6 +5149,12 @@
|
|||
}
|
||||
}
|
||||
},
|
||||
"gulp-rename": {
|
||||
"version": "2.0.0",
|
||||
"resolved": "https://registry.npmjs.org/gulp-rename/-/gulp-rename-2.0.0.tgz",
|
||||
"integrity": "sha512-97Vba4KBzbYmR5VBs9mWmK+HwIf5mj+/zioxfZhOKeXtx5ZjBk57KFlePf5nxq9QsTtFl0ejnHE3zTC9MHXqyQ==",
|
||||
"dev": true
|
||||
},
|
||||
"gulp-sass": {
|
||||
"version": "4.1.0",
|
||||
"resolved": "https://registry.npmjs.org/gulp-sass/-/gulp-sass-4.1.0.tgz",
|
||||
|
|
|
|||
32
package.json
32
package.json
|
|
@ -7,38 +7,11 @@
|
|||
"main": "dist/js/adminlte.min.js",
|
||||
"scripts": {
|
||||
"bundlewatch": "bundlewatch --config .bundlewatch.config.json",
|
||||
"css-all": "npm-run-all css css-splits",
|
||||
"css-splits": "npm-run-all css-compile-splits css-prefix-splits css-rtl-splits css-minify-splits",
|
||||
"css": "npm-run-all css-compile css-prefix css-minify",
|
||||
"css-compile-bash": "sass --load-path=node_modules --style expanded --source-map --embed-sources --no-error-css",
|
||||
"css-compile": "npm run css-compile-bash -- scss/adminlte.scss:dist/css/adminlte.css",
|
||||
"css-compile-splits": "npm-run-all --parallel css-compile-dark-splits",
|
||||
"css-compile-dark-splits": "npm run css-compile-bash -- scss/dark/:dist/css/dark/",
|
||||
"css-prefix-bash": "postcss --config build/postcss.config.js --replace",
|
||||
"css-prefix": "npm run css-prefix-bash -- \"dist/css/*.css\" \"!dist/css/*.min.css\" \"!dist/css/dark/*.css\" \"!dist/css/rtl/*.css\"",
|
||||
"css-prefix-splits": "npm run css-prefix-bash -- \"dist/css/**/*.css\" \"!dist/css/rtl/*.css\" \"!dist/css/**/*.min.css\"",
|
||||
"css-rtl-splits": "cross-env NODE_ENV=RTL postcss --config build/postcss.config.js --dir \"dist/css/rtl\" --ext \".rtl.css\" \"dist/css/*.css\" \"dist/css/**/*.css\" \"!dist/css/**/*.rtl.css\" \"!dist/css/*.min.css\" \"!dist/css/**/*.min.css\"",
|
||||
"css-minify-bash": "cleancss -O1 --format breakWith=lf --with-rebase --source-map --source-map-inline-sources --output ",
|
||||
"css-minify": "npm run css-minify-bash -- dist/css/ --batch --batch-suffix \".min\" \"dist/css/*.css\" \"!dist/css/*.min.css\"",
|
||||
"css-minify-splits": "npm-run-all --parallel css-minify-split:dark css-minify-split:rtl",
|
||||
"css-minify-split:dark": "npm run css-minify-bash -- dist/css/dark/ --batch --batch-suffix \".min\" \"dist/css/dark/*.css\" \"!dist/css/dark/*.min.css\"",
|
||||
"css-minify-split:rtl": "npm run css-minify-bash -- dist/css/rtl/ --batch --batch-suffix \".min\" \"dist/css/rtl/*.css\" \"!dist/css/rtl/*.min.css\"",
|
||||
"css-lint": "stylelint \"scss/**/*.scss\" --cache --cache-location .cache/.stylelintcache",
|
||||
"dev": "npm-run-all --parallel watch sync",
|
||||
"lockfile-lint": "lockfile-lint --allowed-hosts npm --allowed-schemes https: --empty-hostname false --type npm --path package-lock.json",
|
||||
"js": "npm-run-all js-compile js-minify",
|
||||
"js-compile": "npm-run-all --parallel ts:build ts:type-check",
|
||||
"ts:build": "node build/esbuild.config.js",
|
||||
"ts:type-check": "tsc --noEmit",
|
||||
"js-minify": "esbuild dist/js/adminlte.js --minify --sourcemap --outfile=dist/js/adminlte.min.js",
|
||||
"js-lint": "eslint --ext=js,ts --cache --cache-location .cache/.eslintcache --report-unused-disable-directives .",
|
||||
"lint": "npm-run-all --continue-on-error --parallel css-lint js-lint lockfile-lint",
|
||||
"compile": "npm-run-all --parallel css js",
|
||||
"production": "npm-run-all --parallel css-all js",
|
||||
"sync": "browser-sync start --server --files *.html pages/ dist/",
|
||||
"watch": "concurrently \"npm:watch-*\"",
|
||||
"watch-css": "nodemon --watch scss -e scss -x \"npm-run-all css-compile css-prefix\"",
|
||||
"watch-js": "nodemon --watch ts -e ts -x \"npm-run-all js-compile\""
|
||||
"lint": "npm-run-all --continue-on-error --parallel css-lint js-lint lockfile-lint"
|
||||
},
|
||||
"keywords": [
|
||||
"css",
|
||||
|
|
@ -76,7 +49,7 @@
|
|||
"concurrently": "^6.1.0",
|
||||
"cross-env": "^7.0.3",
|
||||
"del": "^6.0.0",
|
||||
"esbuild": "^0.11.21",
|
||||
"esbuild": "^0.11.23",
|
||||
"eslint": "^7.26.0",
|
||||
"eslint-config-xo": "^0.36.0",
|
||||
"eslint-config-xo-typescript": "^0.41.1",
|
||||
|
|
@ -87,6 +60,7 @@
|
|||
"gulp-file-include": "^2.3.0",
|
||||
"gulp-npm-dist": "^1.0.3",
|
||||
"gulp-postcss": "^9.0.0",
|
||||
"gulp-rename": "^2.0.0",
|
||||
"gulp-sass": "^4.1.0",
|
||||
"gulp-sourcemaps": "^3.0.0",
|
||||
"gulp-wait": "0.0.2",
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@
|
|||
<aside class="main-sidebar sidebar-bg-dark sidebar-color-primary shadow">
|
||||
<div class="brand-container">
|
||||
<a href="#" class="brand-link">
|
||||
<img src="./assets/img/AdminLTELogo.png" alt="AdminLTE Logo" class="brand-image opacity-80 shadow">
|
||||
<img src="@@path/assets/img/AdminLTELogo.png" alt="AdminLTE Logo" class="brand-image opacity-80 shadow">
|
||||
<span class="brand-text fw-light">AdminLTE 4</span>
|
||||
</a>
|
||||
<a class="pushmenu mx-1" data-pushmenu="mini" href="#" role="button"><i class="fas fa-angle-double-left"></i></a>
|
||||
|
|
@ -49,7 +49,7 @@
|
|||
</a>
|
||||
<ul class="nav nav-treeview">
|
||||
<li class="nav-item">
|
||||
<a href="./pages/forms/general.html" class="nav-link">
|
||||
<a href="@@path/pages/forms/general.html" class="nav-link">
|
||||
<i class="nav-icon far fa-circle"></i>
|
||||
<p>
|
||||
General Elements
|
||||
|
|
|
|||
Loading…
Reference in New Issue