【问题标题】:Gulp - TypeError: Cannot assign to read only property 'cwd' of bower / bootstrap.cssGulp - TypeError:无法分配给 bower / bootstrap.css 的只读属性“cwd”
【发布时间】:2026-01-16 22:25:36
【问题描述】:

我刚刚开始掌握 Gulp.js,这是我似乎无法解决的唯一错误。

我已经通过 bower 安装了引导程序,我正在尝试缩小引导程序 css。

这是我的 gulp 任务;

gulp.task('minifycss', function() {
gulp.src('www/css/animate.css', 'www/bower_components/bootstrap/dist/css/bootstrap.css')
    .pipe(minifycss({compatibility: 'ie8'}))
    .pipe(gulp.dest('www-deploy/css/'));
});

但是,当我运行我的主要 gulp 任务时。它指出该文件是“只读的”

Karls-MacBook-Pro:cmp-2015 karltaylor$ gulp
[13:48:50] Using gulpfile ~/Documents/web/cmp-2015/gulpfile.js
[13:48:50] Starting 'sassMin'...
[13:48:50] Finished 'sassMin' after 12 ms
[13:48:50] Starting 'minifycss'...
[13:48:50] 'minifycss' errored after 508 μs
[13:48:50] TypeError: Cannot assign to read only property 'cwd' of www/bower_components/bootstrap/dist/css/bootstrap.css
    at Object.gs.createStream (/Users/karltaylor/Documents/web/cmp-2015/node_modules/gulp/node_modules/vinyl-fs/node_modules/glob-stream/index.js:19:46)
    at Object.gs.create (/Users/karltaylor/Documents/web/cmp-2015/node_modules/gulp/node_modules/vinyl-fs/node_modules/glob-stream/index.js:68:42)
    at Gulp.src (/Users/karltaylor/Documents/web/cmp-2015/node_modules/gulp/node_modules/vinyl-fs/lib/src/index.js:33:23)
    at Gulp.<anonymous> (/Users/karltaylor/Documents/web/cmp-2015/gulpfile.js:35:7)
    at module.exports (/Users/karltaylor/Documents/web/cmp-2015/node_modules/gulp/node_modules/orchestrator/lib/runTask.js:34:7)
    at Gulp.Orchestrator._runTask (/Users/karltaylor/Documents/web/cmp-2015/node_modules/gulp/node_modules/orchestrator/index.js:273:3)
    at Gulp.Orchestrator._runStep (/Users/karltaylor/Documents/web/cmp-2015/node_modules/gulp/node_modules/orchestrator/index.js:214:10)
    at /Users/karltaylor/Documents/web/cmp-2015/node_modules/gulp/node_modules/orchestrator/index.js:279:18
    at finish (/Users/karltaylor/Documents/web/cmp-2015/node_modules/gulp/node_modules/orchestrator/lib/runTask.js:21:8)
    at module.exports (/Users/karltaylor/Documents/web/cmp-2015/node_modules/gulp/node_modules/orchestrator/lib/runTask.js:60:3)

我尝试过的事情:

  1. 重新安装引导程序
  2. 将实际的 bootstrap.css 文件移动到我的 css 文件中,但它的作用完全相同。

编辑:已解决 = 要使用多个源,您必须将它们放在一个数组中。

来源:https://github.com/gulpjs/gulp/blob/master/docs/recipes/using-multiple-sources-in-one-task.md

【问题讨论】:

  • 我认为这是因为您的 gulp.src 中有两个文件。试试这一行来验证(替换你的 gulp.src 行):return gulp.src('www/bower_components/bootstrap/dist/css/bootstrap.css')
  • @topleft 这成功了!当使用多个源文件时,您必须将其放在数组中或使用合并流。 - github.com/gulpjs/gulp/blob/master/docs/recipes/…
  • 将它们放入数组中解决了这个问题。 gulp.src([ , ])

标签: css twitter-bootstrap command-line gulp bower


【解决方案1】:

当我尝试输出 2 个 css 文件并且我没有使用数组 [] 时遇到了这个问题。

代替:

gulp.src('www/css/animate.css', 'www/bower_components/bootstrap/dist/css/bootstrap.css')
    .pipe(minifycss({compatibility: 'ie8'}))
    .pipe(gulp.dest('www-deploy/css/'));
});

使用这个:

gulp.src(['www/css/animate.css', 'www/bower_components/bootstrap/dist/css/bootstrap.css'])
    .pipe(minifycss({compatibility: 'ie8'}))
    .pipe(gulp.dest('www-deploy/css/'));
});

说明:

gulp.src(['./file1.scss', './file2.scss']);

【讨论】:

    【解决方案2】:

    就像@topleft 提到的那样,在我的 gulp.src 中使用多个文件是语法错误。要使用多个来源,您需要将它们放在一个数组中。

    例子:

    var gulp = require('gulp');
    var concat = require('gulp-concat');
    
    gulp.task('default', function() {
        return gulp.src(['foo/*', 'bar/*'])
            .pipe(concat('result.txt'))
            .pipe(gulp.dest('build'));
    });
    

    【讨论】:

      【解决方案3】:

      或者你也可以试试

      return gulp.src('www/**/*.css')
      

      如果这是想要的效果,它应该在你的目录中添加每个 .css

      【讨论】:

      • 在这种情况下顺序很重要!那你就做不到了。
      最近更新 更多