Question

我一直在使用光滑的灯箱在我的网站上创建弹出效果。在开发过程中一切都很好（或者我认为）。在将网站上传到开发服务器（使用FTP）后，光滑的灯箱正试图查看bower_components文件夹以找到＆s-light-lightbox.css＆＃39;文件而不是编译的css文件。

这是我的bower.json，gulpfile.js和main.scss，其中包含所有内容。

bower.json

 {
  "name": "rb-corporate-buzz",
  "private": true,
  "dependencies": {
    ...
    "slick-lightbox": "^0.2.1"
  },
}

gulpfile.js

gulp.task('scripts', function(){
    return gulp.src([
        ...
        'bower_components/slick-carousel/slick/slick.js',
        'bower_components/slick-lightbox/dist/slick-lightbox.js',
        ...
        'assets/js/custom/main.js'
    ])
    .pipe(concat('main.js'))
    .pipe(rename({ suffix: '.min' }))
    .pipe(uglify())
    .pipe(gulp.dest('assets/js/'))
    .pipe(notify({
        message: 'Scripts minified'
    }));
});

gulp.task('styles', function(){
    return gulp.src('assets/scss/main.scss')
        .pipe(sass().on('error', sass.logError))
        .pipe(cssnano({ zindex: false }))
        .pipe(rename({ suffix: '.min'}))
        .pipe(gulp.dest('assets/css/'))
        .pipe(notify({
            message: 'Styles Minified'
        }));
});

main.scss ＆lt; - 此文件导入我的所有scss文件。

@import "../../bower_components/slick-carousel/slick/slick.scss";
@import "../../bower_components/slick-lightbox/dist/slick-lightbox.css";

在开发服务器上，如果没有安装bower，它将获得404：

http://192.168.55.11/bower_components/slick-lightbox/dist/slick-lightbox.css 404 (Not Found)

光滑的灯箱试图在使用gulp构建后查看bower_components

0 个答案: