Wiredep includes js files but does not include css. What am I doing wrong?

A

Alexander Epikhin2015-09-19 14:42:05

gulp.js

Alexander Epikhin, 2015-09-19 14:42:05

html:

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>Document</title>
  <!-- bower:css -->
  <!-- endbower -->
</head>
<body>
  <!-- bower:js -->
  <!-- endbower -->
</body>
</html>

gulp-file:

var gulp = require('gulp'),
    wiredep = require('wiredep').stream;

gulp.task('wiredep', function () {
    gulp.src('./index.html')
        .pipe(wiredep({
            directory : './bower_components'
        }))
        .pipe(gulp.dest('./'));
});

package.json:

{
  "name": "manifest",
  "version": "0.1.0",
  "devDependencies": {
    "gulp": "^3.9.0",
    "wiredep": "^2.2.2"
  }
}

bower.json:

{
  "name": "manifest",
  "version": "0.1.0",
  "description": "my first bower project",
  "license": "MIT",
  "dependencies": {
    "bootstrap": "~3.3.5",
    "jquery": "~2.1.4"
  }
}

.bowerrc:

{
  "directory" : "bower_components"
}

I run wiredep, the result is this:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Document</title>
  <!-- bower:css -->
  <!-- endbower -->
</head>
<body>
  <!-- bower:js -->
  <script src="bower_components/jquery/dist/jquery.js"></script>
  <script src="bower_components/bootstrap/dist/js/bootstrap.js"></script>
  <!-- endbower -->
</body>
</html>

Styles are not connected
wiredep also set the extreme version (3.0) did not help.
How to solve the problem?

Reply

Answer the question

In order to leave comments, you need to log in

1 answer(s)

A

Alexander Epikhin, 2015-09-20
@leshiple

In the case of Bootstrap:
In file:
Section:

"main": [
    "less/bootstrap.less",
    "dist/js/bootstrap.js"
  ],

Needs to be changed to:

"main": [
    "dist/css/bootstrap.css",
    "dist/js/bootstrap.js"
  ],