GRUNT: связанные CSS-файлы не отображаются на странице index.html.
У меня есть задание grunt для объединения файлов CSS в комбинированный файл.css, и оно успешно объединяет файлы CSS.
grunt.initConfig({
concat: {
options: {
separator: '\n\n\n',
base: "../../../",
},
css: {
src: [ '../../my/demo/v1.0/1.css',
'../../my/demo/v1.0/2css',
'../../my/demo/v1.0/3.css',
],
dest: '../../my/demo/v1.0/combined123.css',
},
});
grunt.loadNpmTasks('grunt-concat-css');
grunt.registerTask('default', ['concat']);
Однако я не могу понять, как мне заменить 1.css, 2.css и 3.css в index.html на файл комбинированный123.css, используя Grunt.
При попытке вручную заменить эти CSS-файлы на CSS-файлы в index.html, выполнение команды grunt возвращает все изменения, внесенные в index.html. Когда я делаю Просмотр исходного кода для страницы в браузере, он показывает несколько файлов CSS вместо последнего объединенного файла комбинированного файла 123.css.
Как я могу заменить эти CSS-файлы комбинированным файлом 123.css в теге index.html, используя задачу Grunt.
Это Gruntfile.js
grunt.initConfig({
root: root,
//concat:css task implemented here as mentioned in above code snippet
connect: {
server: {
options: {
port: grunt.option('port') || 9090,
keepalive: false,
base: "../../../"
}
}
},
open: {
all: {
path: 'http://localhost:<%= connect.server.options.port%>/my/demo/v1.0/dest/index.html'
}
},
watch: {
html: {
files: ['views/*.html', 'index_temp.html'],
tasks: ['mergeFiles']
},
livereload: {
files: ['dest/index.html'],
options: { livereload: true }
}
},
htmlbuild: {
dist: {
src: 'index_temp.html',
dest: '.tmp/',
options: {
beautify: true,
relative: true,
sections: {
headers: 'views/abc.html',
input: 'views/def.html',
}
}
}
},
replace: {
example: {
src: ['.tmp/index_temp.html'],
dest: 'dest/index.html',
replacements: [ {
from: /^\s*\n/gm,
to: ''
},
{
from: /\s+$/,
to: ''
}],
}
});
require('matchdep').filterDev('grunt-*').forEach(grunt.loadNpmTasks);
grunt.loadNpmTasks('grunt-contrib-concat');
grunt.loadNpmTasks('grunt-concat-css');
grunt.registerTask('server', ['mergeFiles', 'open' ,'connect', 'watch' ]);
grunt.registerTask('default', ['mergeFiles', 'open' ,'connect', 'watch', 'concat']);
grunt.registerTask('mergeFiles', ["htmlbuild:dist", "replace:example"]);
Любая помощь приветствуется.