Question

出于某种原因，我的wiredep配置正在拿起我的bower js文件，但不是css。

这是我的gulpfile：

gulp.task('wiredep', function(){

var options = config.getWiredepDefaultOptions();
var wiredep = require('wiredep').stream;

  return gulp
      .src(config.index)
      .pipe($.using())
      .pipe(wiredep(options))
      .pipe($.inject(gulp.src(config.js)))
      .pipe(gulp.dest(config.layout))
});

这是我的bower.json

    {
  "name": "//",
  "version": "0.0.0",
  "homepage": "//",
  "authors": [
    "//"
  ],
  "description": "//",
  "license": "MIT",
  "ignore": [
    "**/.*",
    "node_modules",
    "bower_components",
    "public/vendor",
    "test",
    "tests"
  ],
  "dependencies": {
    "jquery": "~2.1.4",
    "toastr": "~2.1.1",
    "angular": "~1.4.1",
    "angular-resource": "~1.4.1",
    "angular-route": "~1.4.1",
    "bootstrap": "~3.3.5",
    "angular-mocks": "~1.4.1"
  }
}

我使用Jade作为模板，JS正在通过，但不是css。

doctype
html
    head

        //bower:css
        //endbower

        base(href="/")
        body(ng-app='app')
        include currentUser
        block main-content

        //bower:js
        script(src='/vendor/jquery/dist/jquery.js')
        script(src='/vendor/toastr/toastr.js')
        script(src='/vendor/angular/angular.js')
        script(src='/vendor/angular-resource/angular-resource.js')
        script(src='/vendor/angular-route/angular-route.js')
        script(src='/vendor/bootstrap/dist/js/bootstrap.js')
        script(src='/vendor/angular-mocks/angular-mocks.js')
        //endbower

Answer 1

试试吧。

转到 - ＆gt; bower_components - ＆gt; bootstrap - ＆gt; bower.json

修改“main”属性并写入：

[...]

“main”：“dist / css / bootstrap.css”，

[...]

它现在有效。

注意：我删除了bootstrap.js的条目，因为我不需要它。

享受：）

Answer 2

您的软件包似乎未在其bower.json文件中正确列出其依赖项。

https://www.npmjs.com/package/wiredep#what-can-go-wrong

您可以在您的bower.json中覆盖您的包主要属性，如下所示：

在bower.json中

{
  ...
  "dependencies": {
    "package-without-main": "1.0.0"
  },
  "overrides": {
    "bootstrap": {
      "main": ["dist/js/bootstrap.js", "dist/css/bootstrap.css"]
    }
  }
}

https://www.npmjs.com/package/wiredep#bower-overrides

或者在你的wiredep配置对象中：

wiredepOptions: {
    overrides: {
        angular: {
            dependencies: {
                jquery: '^2.2.0'
            }
        },
        bootstrap: {
            main: ["dist/js/bootstrap.js", "dist/css/bootstrap.css"]
        },
        slimScroll: {
            main: 'jquery.slimscroll.js'
        },
        codemirror: {
            main: [
                'lib/codemirror.js',
                'lib/codemirror.css',
                'mode/markdown/markdown.js',
                'mode/javascript/javascript.js',
                'theme/xq-light.css'
            ]
        },
        'font-awesome': {
            main: 'css/font-awesome.css'
        }
    }
}

gulp wiredep捡起凉亭js但也没有css

2 个答案: