无法在localhost：3000上获取/

Question

我遇到此问题，浏览器在执行Gulp时仅显示Cannot GET /。

Answer 1

事实证明，gulp看起来有点片状，需要一点点培育才能开始工作。

这纯粹是为了让它有效。这可能是过度杀戮，但如果你只是想看到它有效，这对我有帮助。

原始教程https://coursetro.com/posts/code/130/Learn-Bootstrap-4-Final-in-2018-with-our-Free-Crash-Course向我提供了一些已预先安装的问题。

我找到了一些我可能会帮助的网站： https://www.npmjs.com/package/gulp 可能值得用上面链接中的选项重写gulpfile.js以获得额外的依赖性。您可以稍后再更改。

如果您只是复制代码，则可能需要添加这些依赖项：

npm install gulp
npm install gulp-coffee
npm install gulp-concat
npm install gulp-uglify
npm install gulp-imagemin
npm install gulp-sourcemaps

还有这个链接可能有帮助，有gulp-cli

npm install --global gulp-cli
npm install --save-dev gulp

确保您在根文件夹[bs4]中有package.json文件。还要确保在src文件夹中正确命名其他目录。

所以你应该：

根目录[bs4] 在根目录中：[src]，gulpfile.js

gulpfile.js如下所示：

var gulp        = require('gulp');
var browserSync = require('browser-sync').create();
var sass        = require('gulp-sass');

// Compile sass into CSS & auto-inject into browsers
gulp.task('sass', function() {
    return gulp.src(['node_modules/bootstrap/scss/bootstrap.scss', 'src/scss/*.scss'])
        .pipe(sass())
        .pipe(gulp.dest("src/css"))
        .pipe(browserSync.stream());
});

// Move the javascript files into our /src/js folder
gulp.task('js', function() {
    return gulp.src(['node_modules/bootstrap/dist/js/bootstrap.min.js', 'node_modules/jquery/dist/jquery.min.js', 'node_modules/popper.js/dist/umd/popper.min.js'])
        .pipe(gulp.dest("src/js"))
        .pipe(browserSync.stream());
});

// Static Server + watching scss/html files
gulp.task('serve', ['sass'], function() {

    browserSync.init({
        server: "./src"  
    });

    gulp.watch(['node_modules/bootstrap/scss/bootstrap.scss', 'src/scss/*.scss'], ['sass']);
    gulp.watch("src/*.html").on('change', browserSync.reload);
});

gulp.task('default', ['js','serve']);

将目录更改为$ cd bs4

使用npm init -y

添加package.json

然后install npm

然后：npm install bootstrap jquery popper.js --save

然后全局安装gulp：npm install gulp -g browser-sync gulp-sass --save-dev

添加index.html文件（确保复制html文件，因为它是在coursetro.com上编写的）

你应该得到像这个图像的文件系统：

然后尝试运行：gulp

运行Gulp之后，你最终会得到一个像这个图像的文件系统，styles.css会自动添加到css文件夹中：

（我添加.map文件只是因为Safari丢失了它无法找到它们的错误。）

另外！确保添加了一个样式。 scss （而不是styles.css）文件，并将其添加到 scss 文件夹

如果像我一样遇到npm错误，请尝试卸载npm和依赖项，重新启动并重新安装。如果您有耐心，它将开始起作用。再进行15分钟的返工，这是值得的。

最后，在你运行gulp之前。确保从bs4发送shell

$ yourCPU： bs4 用户名$ gulp