asp net core npm包管理
- 新建package.json
{
"version": "1.0.0",
"name": "asp.net",
"private": true,
"devDependencies": {},
"dependencies": {
"bootstrap": "4.6.0",
"jquery": "3.5.1",
"del": "^3.0.0",
"gulp": "^4.0.0",
"gulp-concat": "^2.6.1",
"gulp-cssmin": "^0.2.0",
"gulp-htmlmin": "^3.0.0",
"gulp-less": "^4.0.1",
"gulp-uglify": "^3.0.0",
"merge-stream": "^1.0.1"
}
}
- 新建bundleconfig.json
[
{
"outputFileName": "wwwroot/css/site.min.css",
"inputFiles": [
"wwwroot/lib/*.css"
]
},
{
"outputFileName": "wwwroot/js/site.min.js",
"inputFiles": [
"wwwroot/lib/*.js"
],
"minify": {
"enabled": true,
"renameLocals": true
},
"sourceMap": false
}
]
- 新建gulpfile.js
'use strict';
var gulp = require('gulp'),
concat = require('gulp-concat'),
cssmin = require('gulp-cssmin'),
htmlmin = require('gulp-htmlmin'),
uglify = require('gulp-uglify'),
merge = require('merge-stream'),
less = require('gulp-less'),
del = require('del'),
bundleconfig = require('./bundleconfig.json');
var paths = {
webroot: "./wwwroot/"
};
paths.node_modules_css_libs = [
'node_modules/bootstrap/dist/css/bootstrap.css',
]
paths.node_modules_js_libs = [
'node_modules/jquery/dist/jquery.js',
'node_modules/bootstrap/dist/js/bootstrap.js',
]
paths.lib = paths.webroot + 'lib/*.js';
paths.js = paths.webroot + "js/**/*.js";
paths.minJs = paths.webroot + "js/**/*.min.js";
paths.concatJsDest = paths.webroot + "js/site.min.js";
const regex = {
css: /\.css$/,
html: /\.(html|htm)$/,
js: /\.js$/
};
gulp.task('compile-less', function () {
return gulp.src('wwwroot/less/*.less')
.pipe(less())
.pipe(gulp.dest('wwwroot/css/'));
});
/* Task to clear previous css */
gulp.task('del', function (cb) {
return del(['wwwroot/css/dist/*.min.css'], cb);
});
/* Task to minify css */
gulp.task('min:css', function () {
return gulp.src('wwwroot/css/*.css')
.pipe(cssmin())
// The gulp-uglify plugin won't update the filename
// .pipe(uglify())
// So use gulp-rename to change the extension
.pipe(rename({ extname: '.min.css' }))
.pipe(dest('wwwroot/css/dist/'));
});
gulp.task('min:js', async function () {
merge(getBundles(regex.js).map(bundle => {
return gulp.src(bundle.inputFiles, { base: '.' })
.pipe(concat(bundle.outputFileName))
.pipe(uglify())
.pipe(gulp.dest('.'));
}))
});
gulp.task('min:css', async function () {
merge(getBundles(regex.css).map(bundle => {
return gulp.src(bundle.inputFiles, { base: '.' })
.pipe(concat(bundle.outputFileName))
.pipe(cssmin())
.pipe(gulp.dest('.'));
}))
});
gulp.task('min:html', async function () {
merge(getBundles(regex.html).map(bundle => {
return gulp.src(bundle.inputFiles, { base: '.' })
.pipe(concat(bundle.outputFileName))
.pipe(htmlmin({ collapseWhitespace: true, minifyCSS: true, minifyJS: true }))
.pipe(gulp.dest('.'));
}))
});
gulp.task('min', gulp.series(['min:js', 'min:css', 'min:html']));
gulp.task('clean', () => {
return del(bundleconfig.map(bundle => bundle.outputFileName));
});
gulp.task('watch', () => {
getBundles(regex.js).forEach(
bundle => gulp.watch(bundle.inputFiles, gulp.series(["min:js"])));
getBundles(regex.css).forEach(
bundle => gulp.watch(bundle.inputFiles, gulp.series(["min:css"])));
getBundles(regex.html).forEach(
bundle => gulp.watch(bundle.inputFiles, gulp.series(['min:html'])));
});
gulp.task('lib',async () =>{ //复制npm包到web root中
gulp.src(paths.node_modules_css_libs).pipe(gulp.dest(paths.webroot + 'lib/css'));
gulp.src(paths.node_modules_js_libs).pipe(gulp.dest(paths.webroot + 'lib/js'));
});
const getBundles = (regexPattern) => {
return bundleconfig.filter(bundle => {
return regexPattern.test(bundle.outputFileName);
});
};
/* Task when running `gulp` from terminal */
gulp.task('default', gulp.series('del', 'compile-less', 'min'));
- 安装nuget包
BuildBundlerMinifier
项目文件添加
<Target Name="MyPreCompileTarget" BeforeTargets="Build">
<Exec Command="gulp min" />
</Target>
参考:微软官方

浙公网安备 33010602011771号