首页
学习
活动
专区
工具
TVP
发布
社区首页 >问答首页 >如何向css文件中添加样式?

如何向css文件中添加样式?
EN

Stack Overflow用户
提问于 2018-08-13 23:29:24
回答 1查看 0关注 0票数 0

我正在研究一个需要Gruntjs编译前端的原型。 当我在终端中运行grunt时,似乎Grunt正在向overview.css和styles.css添加样式。 这是项目的Grunt文件以及强制更改的屏幕截图。

代码语言:txt
复制
'use strict';
module.exports=function(grunt) {
    require('time-grunt')(grunt);
    require('jit-grunt')(grunt, {
        import: 'import',
    }
    );
    grunt.initConfig( {
        pkg: grunt.file.readJSON('package.json'), watch: {
        scripts: {
            files: [ 'olb/js/*/*.js', 'olb/js/*.js'], tasks: ['import'],
        }, css: {
            files: [ 'olb/scss/*.scss', 'olb/scss/src/partials/*.scss'], tasks: [ 'sass'],
        }, markup: {
            files: [ 'templates/*/*.hbs', 'templates/*/*/*.hbs', 'templates/*/*/*/*.hbs', 'olb/**/*.hbs', ], tasks: [ 'assemble']
        }
        }, import: {
            options: {},

        overview: {
            src: [ 'olb/js/src/plugins.js', 'olb/js/src/global.js', 'olb/js/src/tabcontent.js', 'olb/js/src/backtotop.js', 'olb/js/src/responsivetable.js', 'olb/js/src/lightbox.js', 'olb/js/src/iOS-orientationchange.js', 'olb/js/src/src/tour-tips.js', ], dest: 'olb/js/overview.js',
        }, scripts: {
            src: [ 'olb/js/script-combined.js', 'olb/js/src/input-track.js', 'olb/js/src/tablesorter.js', 'olb/js/src/jquery.maskedinput.js', 'olb/js/src/jquery.zoom.js', 'olb/js/src/ui.jquery.js', 'olb/js/src/select2.js', 'olb/js/src/currency.js', //'olb/js/src/cash-flow-tracker.js',
            'olb/js/src/canvasjs.js', 'olb/js/src/autoNumeric.js', 'olb/js/src/password-rules.js', 'olb/js/src/jquery.alphanum.js'], dest: 'olb/js/script.js'
        }, stylesOverview: {
            src: [ 'olb/css/overview.css', ], dest: 'library/css/overview.css',
        }, stylesDefault: {
            src: [ 'olb/css/styles.css', ], dest: 'library/css/styles.css',
        }, stylesPrint: {
            src: [ 'olb/css/print.css', ], dest: 'library/css/print.css',
        },
    }, uglify: {
        my_target: {
            files: {
                'olb/js/script-combined-min.js': ['olb/js/script-combined.js'],
            }
        }
    }, sass: {
        dist: {
            options: {
                style: 'expanded', loadPath: require('node-neat').loadPath, //sourceMap: auto,
            }, files: {
                // Dictionary of files
                'olb/css/styles.css': 'olb/css/styles.scss', // 'destination': 'source'
                'olb/css/overview.css': 'olb/css/overview.scss'
            }
        }
    }, assemble: {
        options: {
            layout: 'templates/layouts/default.hbs', partials: [ 'templates/includes/{,*/}*.hbs', 'olb/html/_includes/{,*/}*.hbs' // includes for pages within olb dir
            ], flatten: true, data: 'templates/config.yml', helpers: 'templates/helpers/**/*.js', collections: [ {
                title: 'screens', sortorder: 'desc',
            }
            ]
        },
        overview: {
            files: {
                'site-root/overview/': ['templates/pages/overview/*.hbs'],
            }, options: {
                layout: 'templates/layouts/default.hbs'
            }, src: ['templates/pages/overview/*.hbs'], dest: 'site-root/overview/',
        }, profile: {
            files: {
                'olb/html/myProfile/': ['olb/html/myProfile/working-files/*.hbs'],
            }, options: {
                partials: 'olb/html/myProfile/includes/{,*/}*.hbs'
            },
        }, sboLogin: {
            files: {
                'olb/html/sbo-login/': ['olb/html/sbo-login/working-files/*.hbs'],
            }, options: {
                partials: 'olb/html/sbo-login/includes/{,*/}*.hbs'
            },
        }, retailLogin: {
            files: {
                'olb/html/retail-login/': ['olb/html/retail-login/working-files/*.hbs'],
            }, options: {
                partials: 'olb/html/retail-login/includes/{,*/}*.hbs'
            },
        },
        cashFlowTracker: {
            files: {
                'site-root/cash-flow-tracker/': ['templates/pages/cash-flow-tracker/*.hbs'],
            }, options: {
                layout: 'templates/layouts/default.hbs'
            }, src: ['templates/pages/cash-flow-tracker/*.hbs'], dest: 'site-root/cash-flow-tracker/',
        },
    }, browserSync: {
        dev: {
            bsFiles: {
                src: [ 'olb/css/*.css', 'olb/js/*.js', 'site-root/*.html', 'site-root/*/*.html', 'index.html']
            }, options: {
                // proxy: 'olb.dev/olb/',
                server: 'olb/', watchTask: true, debugInfo: true, open: true, browser: 'google chrome', ghostMode: {
                    scroll: false, links: false
                }
            }
        }
    },
}
);
//grunt.loadNpmTasks('grunt-contrib-sass');
grunt.registerTask('default', ['assemble', 'import', 'sass', 'browserSync', 'watch']);
grunt.registerTask('index', ['to_html']);
grunt.registerTask('compile', ['assemble', 'import', 'sass']);
}

;

EN

回答 1

Stack Overflow用户

发布于 2018-08-14 09:08:19

注意以下几行:

代码语言:txt
复制
stylesOverview: 
    src: [ 'olb/css/overview.css', ], dest: 'library/css/overview.css',
}, stylesDefault: {
    src: [ 'olb/css/styles.css', ], dest: 'library/css/styles.css',
}, stylesPrint: {
    src: [ 'olb/css/print.css', ], dest: 'library/css/print.css',
}

它写在导入任务中,这些行设置了应插入其他样式的css文件。 如果你不想插入样式,可以尝试删除这些行。

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/-100002117

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档