bootstrap.css 没有出现在浏览器中

Question

我正在使用本教程设置一个 angular 2 和 gulp 的项目。 http://blog.codeleak.pl/2016/03/quickstart-angular2-with-typescript-and.html

我所做的唯一更改是将引导程序添加到 package.json，但它没有显示在浏览器中。它显示在我的 IDE 项目中的 node_modules 和 lib 文件夹中。但是如果我使用引导类，它们就不会被应用。 bootstrap.min.css 文件也不显示在浏览器中。

我在我的 gulp 文件中添加了关于引导程序的 2 行

gulp.task("libs", () => {
    return gulp.src([
        'es6-shim/es6-shim.min.js',
        'systemjs/dist/system-polyfills.js',
        'systemjs/dist/system.src.js',
        'reflect-metadata/Reflect.js',
        'rxjs/**',
        'zone.js/dist/**',
        '@angular/**',
        'bootstrap/dist/js/bootstrap.min.js',
        'bootstrap/dist/css/bootstrap.min.css'
    ], {cwd: "node_modules/**"}) /* Glob required here. */
    .pipe(gulp.dest("build/lib"));
});

我在 index.html 中添加了这一行以包含它

 <link rel="stylesheet" type="text/css" src="lib/bootstrap/dist/css/bootstrap.min.css">

这是我的项目结构

编辑：澄清一下，我看到 bootstrap.css 文件复制到 IDE 的 lib 文件夹中，但我在浏览器中看不到它。请参阅下面来自 Chrome 开发工具的屏幕截图

关于我可能缺少什么的任何线索？ Github 仓库 - https://github.com/richa008/Angular-starter-app-with-gulp

Answer 1

这应该导入所有相关的文件和目录：

    gulp.task("libs", () => {
        return gulp.src([
            'es6-shim/es6-shim.min.js',
            'systemjs/dist/system-polyfills.js',
            'systemjs/dist/system.src.js',
            'reflect-metadata/Reflect.js',
            'rxjs/**',
            'zone.js/dist/**',
            '@angular/**',
            'bootstrap/dist/**/*.+(js|css.map|css|eot|svg|ttf|woff|woff2)'

        ], { cwd: "node_modules/**" }) /* Glob required here. */
            .pipe(gulp.dest("build/lib"));
    });