web-dev-qa-db-ja.com

Gulp-TypeError：bower / bootstrap.cssのプロパティ「cwd」の読み取り専用に割り当てることができません

私はGulp.jsを理解しようとしていますが、これは回避できないと思われる唯一のエラーです。

私はbootstrap= bower経由でインストールしています。そしてbootstrap 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

csstwitter-bootstrapcommand-linegulpbower
25
Karl Taylor

言及した@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'));
});
55
Karl Taylor

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']);
3
llioor

または、あなたも試すことができます

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

それが望みの効果である場合、ディレクトリ内のすべての.cssを追加する必要があります

2
Antonin Cezard