Question

我的主要JS有以下代码 -

/*global require*/
'use strict';

require.config({
    shim: {
        backbone:{
            deps:[
                  'underscore',
                  'jquery'
            ],
            exports: 'Backbone'
        },
        bootstrap:{deps:['jquery']},
    },
    paths: {
        jquery: '../bower_components/jquery/dist/jquery',
        backbone: '../bower_components/backbone/backbone',
        underscore: '../bower_components/underscore/underscore',
        bootstrap: '../bower_components/bootstrap/dist/js/bootstrap',
        text:'../bower_components/requirejs-text/text',
        router: 'routes/router'
    }
});

require([
    'jquery',
    'underscore',
    'backbone',
    'bootstrap',
    'router'
    //'text!bootstrapCSS'
], function ($, _, Backbone, undefined, mainRouter) {
    var router = new mainRouter();
    Backbone.history.start();
});

和view.home.js具有以下代码

define(
    [
        'jquery', 
        'underscore', 
        'backbone', 
        'bootstrap',
        'text!templates/header.html',
        'text!/bower_components/bootstrap/dist/css/bootstrap.css'
     ], 
    function($, _, Backbone, undefined, header, bootstrapCSS){

        var HomeView = Backbone.View.extend({

            el: '.header-container',

            headerTemplate: _.template(header),

            initialize: function(){
                console.log("in view-home initialize")
                this.render();
            },

            render: function(){
                console.log("render header");
                this.$el.html(this.headerTemplate());
                console.log("render header complete i guess");
            },

            events: {},
          });

        return HomeView;
})

以上代码用于在主html中呈现header.html。 header.html使用bootstrap类进行设计，主要是bootstrap.css。加载页面成功加载包括所有库在内的所有内容，但视图没有所需的显示 - 即它似乎没有引导程序。有什么不对的，我正在做的是我的加载的html没有显示引导程序，我如何通过主干中的require.js在我的header.html中包含bootstrap.css。请帮忙。

使用骨干中的require为模板加载bootstrap.css？

0 个答案: