Grunt 似乎没有跟踪 CSS 文件。
这就是我的 Gruntfile.js 的样子
module.exports = function(grunt) {
// Project configuration.
grunt.initConfig({
pkg: grunt.file.readJSON('package.json'),
//ec2: 'aws.json',
concat: {
vendorCss: {
src: [
'public/vendor/bootstrap/bootstrap.min.css',
'public/vendor/fontawesome/css/font-awesome.css',
'public/vendor/owlcarousel/owl.carousel.css',
'public/vendor/owlcarousel/owl.theme.css',
'public/vendor/magnific-popup/magnific-popup.css'
],
dest: 'public/stylesheets/build/vendors.css'
},
themeCss: {
src: [
'public/stylesheets/theme.css',
'public/stylesheets/theme-elements.css',
'public/stylesheets/theme-blog.css',
'public/stylesheets/theme-animate.css'
],
dest: 'public/stylesheets/build/theme.css'
},
extensionCss: {
src: [
'public/stylesheets/skins/default.css',
'public/stylesheets/custom.css'
],
dest: 'public/stylesheets/build/theme-extension.css'
},
homeCss: {
src:[
'public/vendor/rs-plugin/css/settings.css',
'public/vendor/circle-flip-slideshow/css/component.css'
],
dest: 'public/stylesheets/build/home-page.css'
},
vendorsJs: {
src: [
'public/vendor/jquery/dist/jquery.js',
'public/vendor/jquery.appear/jquery.appear.js',
'public/vendor/jquery.easing/jquery.easing.js',
'public/vendor/jquery-cookie/jquery-cookie.js',
'public/vendor/bootstrap/bootstrap.min.js',
'public/vendor/common/common.js',
'public/vendor/jquery.validation/jquery.validation.js',
'public/vendor/jquery.stellar/jquery.stellar.js',
'public/vendor/jquery.easy-pie-chart/jquery.easy-pie-chart.js',
'public/vendor/jquery.gmap/jquery.gmap.js',
'public/vendor/twitterjs/twitter.js',
'public/vendor/isotope/jquery.isotope.js',
'public/vendor/owlcarousel/owl.carousel.js',
'public/vendor/jflickrfeed/jflickrfeed.js',
'public/vendor/magnific-popup/jquery.magnific-popup.js',
'public/vendor/vide/jquery.vide.js',
'public/javascripts/app/theme.js'
],
dest: 'public/javascripts/build/vendors.js'
},
homeJs: {
src: [
'public/vendor/rs-plugin/js/jquery.themepunch.tools.min.js',
'public/vendor/rs-plugin/js/jquery.themepunch.revolution.min.js',
'public/vendor/circle-flip-slideshow/js/jquery.flipshow.js',
'public/javascripts/app/views/view.home.js'
],
dest: 'public/javascripts/build/home-page.js'
},
contactJs: {
src: [
'https://www.google.com/recaptcha/api.js',
'public/javascripts/app/views/view.contact.js'
],
dest: 'public/javascripts/build/contact-page.js'
},
themeJs: {
src: [
'public/javascripts/app/custom.js',
'public/javascripts/app/preload.js',
'public/javascripts/app/theme.init.js',
'public/javascripts/app/google-analytics.js',
],
dest: 'public/javascripts/build/theme.js'
},
productionCss: {
src: [
'public/stylesheets/build/vendors.css',
'public/stylesheets/build/theme.css',
'public/stylesheets/build/home-page.css',
'public/stylesheets/build/theme-extension.css'
],
dest: 'public/dist/stylesheets/production.css'
},
productionJs: {
src: [
'public/javascripts/build/vendors.js',
'public/javascripts/build/home-page.js',
'public/javascripts/build/contact-page.js',
'public/javascripts/build/theme.js'
],
dest: 'public/javascripts/build/production.js'
},
productionModernizr: {
src: [
'public/vendor/modernizr/modernizr.js'
],
dest: 'public/javascripts/build/modernizr.js'
}
},
uglify: {
productionJs: {
src: 'public/javascripts/build/production.js',
dest: 'public/dist/javascripts/production.min.js'
},
productionModernizr: {
src: 'public/javascripts/build/modernizr.js',
dest: 'public/dist/javascripts/modernizr.min.js'
}
},
cssmin: {
target: {
files: [{
expand: true,
cwd: 'public/dist/stylesheets',
src: ['*.css', '!*.min.css' ],
dest: 'public/dist/stylesheets',
ext: '.min.css'
}]
}
},
imagemin: {
dynamic: {
files: [{
expand: true,
cwd: 'public/images/',
src: ['**/*.{png,jpg,gif}'],
dest: 'public/dist/images'
}]
}
},
watch: {
scripts: {
files: [
'public/stylesheets/**/*.css',
'public/javascripts/**/*.js'
],
tasks: ['concat', 'uglify'],
options: {
spawn: false
}
}
}
});
grunt.loadNpmTasks('grunt-contrib-concat');
grunt.loadNpmTasks('grunt-contrib-cssmin');
grunt.loadNpmTasks('grunt-contrib-uglify');
grunt.loadNpmTasks('grunt-contrib-imagemin');
grunt.loadNpmTasks('grunt-css-url-replace');
//grunt.loadNpmTasks('grunt-contrib-ec2');
// Default task(s).
grunt.registerTask('default', ['concat', 'cssmin'
, 'uglify'
//,'imagemin'
]);
};
我一直在将 CSS 更改添加到 stylesheets/theme.css。因为从 gruntfile 可以看出，这会将“stylesheets/theme.css”转换为“public/stylesheets/build/theme.css”，然后将其转换为“public/dist/stylesheets/production.css” .
这是我从开发人员(我是设计师)那里接手的元素。知道为什么当我运行“grunt”时 CSS 更改没有显示吗？
最佳答案
看起来当你运行 grunt 时，所有实际运行的是
'concat', 'cssmin', 'uglify'
将最后一个代码块更新为
grunt.registerTask('default', ['concat', 'cssmin', 'uglify' ,'watch']);
关于css - 当我运行 grunt 时，我的 css 没有更新，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/32849884/