質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.44%
Node.js

Node.jsとはGoogleのV8 JavaScriptエンジンを使用しているサーバーサイドのイベント駆動型プログラムです。

Sass

Sassは、プログラミング風のコードでCSSを生成できるスタイルシート言語です。 scss ファイルを、変換(コンパイル)してCSSファイルを作成します。

gulp

gulpは、Node.jsをベースとしたタスク自動化ツールの一つ。ストリームでファイルを処理することが特徴です。CSSプリプロセッサの使用時のコンパイルや、CSS・JavaScriptファイルの圧縮・結合などを自動的に行うことができます。

Q&A

解決済

1回答

1579閲覧

gulp4を使用する際に発生したTypeErrorが解消できない

Tatsuo_Iriyama

総合スコア50

Node.js

Node.jsとはGoogleのV8 JavaScriptエンジンを使用しているサーバーサイドのイベント駆動型プログラムです。

Sass

Sassは、プログラミング風のコードでCSSを生成できるスタイルシート言語です。 scss ファイルを、変換(コンパイル)してCSSファイルを作成します。

gulp

gulpは、Node.jsをベースとしたタスク自動化ツールの一つ。ストリームでファイルを処理することが特徴です。CSSプリプロセッサの使用時のコンパイルや、CSS・JavaScriptファイルの圧縮・結合などを自動的に行うことができます。

0グッド

0クリップ

投稿2018/12/02 11:04

##現状

gulp4をインストール後、gulpコマンドを実行したら下記のエラーが発生しました。

[vagrant@local profile]$ gulp [10:58:53] Using gulpfile /vagrant/sample.com/profile/gulpfile.js /home/vagrant/.nvm/versions/node/v10.14.1/lib/node_modules/gulp/bin/gulp.js:129 gulpInst.start.apply(gulpInst, toRun); ^ TypeError: Cannot read property 'apply' of undefined at /home/vagrant/.nvm/versions/node/v10.14.1/lib/node_modules/gulp/bin/gulp.js:129:20 at process._tickCallback (internal/process/next_tick.js:61:11) at Function.Module.runMain (internal/modules/cjs/loader.js:744:11) at startup (internal/bootstrap/node.js:285:19) at bootstrapNodeJSCore (internal/bootstrap/node.js:739:3) [vagrant@local profile]$

https://qiita.com/jshimazu/items/2c281bd2d480cce322e9
こちらの記事を参考にgulpのアップデートを図りましたが、npm install gulpjs/gulp-cli#4.0 -gこちらのコマンド実行時に下記のエラーが発生しました。

[vagrant@local profile]$ npm uninstall gulp -g removed 254 packages in 1.612s [vagrant@local profile]$ npm install gulpjs/gulp-cli#4.0 -g npm ERR! code 1 npm ERR! Command failed: /usr/bin/git checkout 4.0 npm ERR! error: pathspec '4.0' did not match any file(s) known to git. npm ERR! npm ERR! A complete log of this run can be found in: npm ERR! /home/vagrant/.npm/_logs/2018-12-02T11_01_40_492Z-debug.log [vagrant@local profile]$

##質問

このエラーはどのように解消すれば良いでしょうか?

足らない点ありましたら、都度情報を掲載致しますので、ご回答の程よろしくお願い致します。

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答1

0

ベストアンサー

以下のコマンドを実行して、Local versionCLI versionが互いに対応しているかを確認してください。

gulp -v

もし、Local versionもしくはCLI versionのどちらかがもう一方に対応していない場合、どちらかのバージョンをより新しいバージョンの方に合わせる必要があります

ここで、もしCLI versionをアップデートする場合、質問文にあるnpm install gulpjs/gulp-cli#4.0 -gを使います。しかし、このコマンドは現在正常に動作しません。なぜならば、現在のgulpのリポジトリには、#4.0というブランチがないからです。

現在は、いつも行うようにnpm-uninstall, npm-installコマンドを実行することで、古いgulp-cliを削除し、新しいgulp-cliをインストールすることができます。

npm r -g gulp-cli npm i -g gulp-cli

追記
gulp4から、gulp.task()の引数が変更されています。以下のようにすることで、質問者さんのエラーは解消すると思います。

JavaScript

1const gulp = require('gulp'); 2const sass = require('gulp-sass'); 3const $ = require('gulp-load-plugins'); 4 5gulp.task('sass', function () { 6 return gulp.src('webroot/sass/*.sass') 7 .pipe(sass({ 8 outputStyle: 'compressed' 9 }).on('error', sass.logError)) 10 .pipe(gulp.dest('webroot/css')); 11}); 12 13gulp.task('watch', function () { 14 gulp.watch('webroot/sass/*.sass', gulp.task('sass')); 15}); 16 17gulp.task('default', gulp.series('sass'));

投稿2018/12/05 02:57

編集2018/12/21 05:21
s8_chu

総合スコア14731

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

Tatsuo_Iriyama

2018/12/15 15:52

[vagrant@local profile]$ gulp -v [15:49:55] CLI version 2.0.1 [15:49:55] Local version 4.0.0 [vagrant@local profile]$ gulpのバージョンが現状このような形になってまして、上記コマンドを実行してみたんですが、gulpのバージョンがなぜか変わらず困惑しております。 質問当初のコマンドで入らない理由はわかったので、改めて手順を一つずつ教えて頂くことは可能でしょうか? コマンドベースで一つずつをイメージしております。 ご返信遅れまして申し訳ありません。
s8_chu

2018/12/15 16:12

`CLI version`の`gulp-cli`を正常にアンインストールできていない可能性があります。 `npm r -g gulp-cli`を実行した後、`npm ls -g`を実行し、`gulp-cli`がアンインストールできたことが確認できますか?
Tatsuo_Iriyama

2018/12/17 15:58

まず、[ npm r -g gulp-cli ]を実行しましたら [vagrant@local profile]$ npm r -g gulp-cli up to date in 0.039s [vagrant@local profile]$ このような結果になりました。 次に[ npm ls -g ]をしましたら、ツリー構造が表示され、最後に │ │ │ New minor version of npm available! 6.4.1 → 6.5.0 │ │ Changelog: https://github.com/npm/cli/releases/tag/v6.5.0 │ │ Run npm install -g npm to update! │ │ │ このような結果になりました。 初学者なため、gulp-cliがアンインストールされているか、をどこで確認できるかがわかっていない為、お答えできません。大変申し訳ありません。
s8_chu

2018/12/18 17:08 編集

> 次に[ npm ls -g ]をしましたら、ツリー構造が表示され、最後に 最後に表示されるその文章は、新しいバージョンの npm が使用できることを通知しているだけで、 gulp-cli の有無には関係がありません。表示されたツリーの中に gulp-cli があるかどうかでアンインストールされているかどうかがわかります。 以下のコマンドを実行したとき、 gulp-cli が表示されますか? npm ls -g gulp-cli --depth=0
Tatsuo_Iriyama

2018/12/18 23:42

[vagrant@local profile]$ npm ls -g gulp-cli --depth=0 /home/vagrant/.nvm/versions/node/v10.14.1/lib └── (empty) [vagrant@local profile]$ この様な結果が返ってきましたので、削除されているかと思います!
s8_chu

2018/12/19 01:53 編集

なるほど...。 `CLI version 2.0.1`, `Local version 4.0.0`の状態で gulp コマンドが成功するかを、回答文のコマンドを使いもう一度 gulp-cli をインストールして、確認してみていただけませんか?
Tatsuo_Iriyama

2018/12/19 14:08

上記コマンドを実行しまして、 [vagrant@local profile]$ gulp -v [14:06:12] CLI version 2.0.1 [14:06:12] Local version 4.0.0 [vagrant@local profile]$ このような状態からgulpコマンドを叩きましたら [vagrant@local profile]$ gulp internal/modules/cjs/loader.js:582 throw err; ^ Error: Cannot find module 'gulp-load-plugins' at Function.Module._resolveFilename (internal/modules/cjs/loader.js:580:15) at Function.Module._load (internal/modules/cjs/loader.js:506:25) at Module.require (internal/modules/cjs/loader.js:636:17) at require (internal/modules/cjs/helpers.js:20:18) at Object.<anonymous> (/vagrant/sample.com/profile/gulpfile.js:3:9) at Module._compile (internal/modules/cjs/loader.js:688:30) at Object.Module._extensions..js (internal/modules/cjs/loader.js:699:10) at Module.load (internal/modules/cjs/loader.js:598:32) at tryModuleLoad (internal/modules/cjs/loader.js:537:12) at Function.Module._load (internal/modules/cjs/loader.js:529:3) [vagrant@local profile]$ このようなエラーになりました。 現状がこのような形になります。
s8_chu

2018/12/20 00:46 編集

`npm i gulp-load-plugins`を実行して、再度 gulp コマンドを実行してみてください。
Tatsuo_Iriyama

2018/12/20 10:17

上記コマンドとgulpコマンドを実行した結果になります。 [vagrant@local profile]$ npm i gulp-load-plugins npm WARN optional SKIPPING OPTIONAL DEPENDENCY: minimist@1.2.0 (node_modules/fsevents/node_modules/rc/node_modules/minimist): npm WARN enoent SKIPPING OPTIONAL DEPENDENCY: ENOENT: no such file or directory, open '/vagrant/sample.com/profile/node_modules/fsevents/node_modules/rc/node_modules/minimist/package.json.1690860392' npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.2.4 (node_modules/fsevents): npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.2.4: wanted {"os":"darwin","arch":"any"} (current: {"os":"linux","arch":"x64"}) + gulp-load-plugins@1.5.0 updated 1 package and audited 7071 packages in 12.39s found 0 vulnerabilities [vagrant@local profile]$ [vagrant@local profile]$ [vagrant@local profile]$ gulp assert.js:350 throw err; ^ AssertionError [ERR_ASSERTION]: Task function must be specified at Gulp.set [as _setTask] (/vagrant/sample.com/profile/node_modules/undertaker/lib/set-task.js:10:3) at Gulp.task (/vagrant/sample.com/profile/node_modules/undertaker/lib/task.js:13:8) at Object.<anonymous> (/vagrant/sample.com/profile/gulpfile.js:58:6) at Module._compile (internal/modules/cjs/loader.js:688:30) at Object.Module._extensions..js (internal/modules/cjs/loader.js:699:10) at Module.load (internal/modules/cjs/loader.js:598:32) at tryModuleLoad (internal/modules/cjs/loader.js:537:12) at Function.Module._load (internal/modules/cjs/loader.js:529:3) at Module.require (internal/modules/cjs/loader.js:636:17) at require (internal/modules/cjs/helpers.js:20:18) [vagrant@local profile]$ 解消される事なくエラーになりました。
Tatsuo_Iriyama

2018/12/20 10:24

長々とお付き合いありがとうございます。。。
s8_chu

2018/12/20 12:24 編集

`gulpfile.js`には何か書いていますか?もし何かを記述していれば、それが原因でエラーが発生している可能性があるので、質問文に`gulpfile.js`の内容を追記していただけませんか?
Tatsuo_Iriyama

2018/12/20 15:36

var gulp = require('gulp'); var sass = require('gulp-sass'); var $ = require('gulp-load-plugins')(); gulp.task('sass', function () { gulp.src('webroot/sass/*.sass') .pipe(sass({ outputStyle: 'compressed' }).on('error', sass.logError)) .pipe(gulp.dest('webroot/css')); }); gulp.task('watch', function() { // watch sass gulp.watch('webroot/sass/*.sass', ['sass']); }); gulp.task('default', ['sass']);
Tatsuo_Iriyama

2018/12/20 15:37

このような形になっております
s8_chu

2018/12/21 05:23 編集

`gulpfile.js`の内容を回答文に追記したコードに変更して、 gulp コマンドを実行してみてください。
Tatsuo_Iriyama

2018/12/22 14:23

解決しました!!!!! 本当に長々とありがとうございます。。。 非常に助かりました。。。 ありがとうございました!!!
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.44%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問