Question

我正在尝试建立一个新的工作流程，并观看了一些关于Grunt，Compass和SASS的教程。我下载了bootstrap并插入到我的项目中。我注意到jQuery库没有下载它，或者至少我似乎无法找到它，并且bootstrap的汉堡菜单似乎不起作用。我错过了什么或者我需要让Grunt为我安装jQuery吗？我想我会把它放进我的gruntfile.js。不确定我是否必须在config.rb文件中要求它？我还将bootstrap.min.js文件添加到dev js文件夹中。我只是下载jQuery文件广告将其添加到该文件夹。我希望继续使用CDN版本。任何帮助或正确方向上的一点都会很棒。我尝试了一些事情，虽然我没有得到任何控制台错误，但菜单不起作用，这通常意味着没有安装jQuery。

以下是我提到的文件：的package.json

{
"name" : "rouxmeetups",
"version" : "0.0.1",
"dependencies" : {
    "grunt" : "~0.4.1",
    "grunt-contrib-watch" : "~0.5.3",
    "grunt-contrib-compass" : "~0.5.0",
    "grunt-contrib-uglify" : "~0.2.2",
    "matchdep" : "~0.1.2",
    "bootstrap-sass-official": "3.2.0",
}

}

gruntfile.js

module.exports = function(grunt){
grunt.loadNpmTasks('grunt-contrib-uglify');
grunt.loadNpmTasks('grunt-contrib-watch');
grunt.loadNpmTasks('grunt-contrib-compass');
grunt.loadNpmTasks('grunt-bootstrap');
grunt.initConfig({
    uglify: {
        my_target:{
            files:{
                '_/js/script.js' : ['_/components/js/*.js']
            } // files
        } // my_target
    },// uglify
    compass: {
        dev: {
            options:{
                config: 'config.rb'
            } // options
        } // dev
    }, // compass
    bootstrap: {
        dev: {
            options:{
                config: 'config.rb'
            } // options
        } // dev
    }, // bootstrap
    watch:{
        options: {
             livereload: true
        }, // options
        scripts:{
            files: ['_/components/js/*.js'],
            tasks: ['uglify']
        }, // scripts
        sass: {
            files: ['_/components/sass/*.scss'],
            tasks: ['compass:dev']
        }, //sass
        html:{
            files: ['*.html']
        } // html       
    } // watch
}) // initConfig
grunt.registerTask('default', 'watch'); // set to be the default task for grunt

}

config.rb

require 'bootstrap-sass'

css_dir = '_/css'
sass_dir = '_/components/sass'
javascript_dir = '_/js'
output_style = :compressed

Answer 1

我建议您使用bower来处理前端依赖项，并且仅针对node-js环境依赖项（您的开发工具）使用npm。

然后你需要一个bower.json（与package.json相同），你将引用bootstrap lib（bootstrap应该自动下载jquery，因为它是它的依赖之一）。

另一件事，我建议您使用grunt-libsass而不是grunt-contrib-compass，它更快，无红宝石。

希望这有帮助

使用bootstrap工作流程通过grunt安装jquery

1 个答案: