今までに私が遭遇したgulpエラーの解説と解決方法まとめ

今回は私がgulpなどを触っていくなかで、発生したgulpエラーとその解決方法についてまとめました。
同じようなエラーに遭遇された方で、エラー解消の一助になれば幸いです。

参考にしたサイトのURLも一緒に載せておきます。

それでは早速いきましょう。



 **【目次】**

 + **1 Error: Cannot find module 'gulp-sass'**
 + **2 Error in plugin "gulp-imagemin"**
 + **3 Error: Node Sass does not yet support your current environment: Windows 64-bit with Unsupported runtime (88)**
 + **4 Error in plugin "gulp-imagemin"**
 + **5 SyntaxError: Identifier '<変数名>' has already been declared**
 + **6 ERR! missing script: start**
 + **7 Error: Cannot find module 'gulp-imagemin'**
 


# 1. Error: Cannot find module 'gulp-sass' #



```
Error: Cannot find module 'gulp-sass'
    at Function.Module._resolveFilename (module.js:337:15)
    at Function.Module._load (module.js:287:25)
    at Module.require (module.js:366:17)
    at require (module.js:385:17)
    at Object.<anonymous> (/Applications/XAMPP/xamppfiles/htdocs/flyscoot.com/gulpfile.js:2:12)
    at Module._compile (module.js:435:26)
    at Object.Module._extensions..js (module.js:442:10)
    at Module.load (module.js:356:32)
    at Function.Module._load (module.js:311:12)
    at Module.require (module.js:366:17)
```

これは、私が始めてnpm run startをターミナルで叩いて発生したエラーです。 

gulp-sassがモジュール内に入っていないことが原因で起こるエラーで
この場合、`npm install --save-dev gulp`と`npm install --save-dev gulp-sass`をターミナルに叩いて
gulpとgulp-sassをローカルインストールすれば、解決することができます。


※`--save-dev`とはローカルインストールするためのコマンドです。
　`npm install -g`がグローバルインストールのコマンドで、`-g`を付けることでグローバルインストールすることになります。


■参考にしたサイト： [stack overflow Error: Cannot find module 'gulp-sass'](https://stackoverflow.com/questions/33314607/error-cannot-find-module-gulp-sass)





# 2.Error in plugin "gulp-imagemin" #


```
[21:33:01] Using gulpfile ~\Desktop\npm-minify-img\gulpfile.js
[21:33:01] Starting 'default'...
[21:33:01] 'default' errored after 217 ms
[21:33:01] Error in plugin "gulp-imagemin"
```


この`Error in plugin "gulp-imagemin"` は呼び出しているディレクトリ内に、pngquantが無いという意味になります。
`pngquant`は圧縮による画質の劣化が無いPNGを簡単に圧縮処理してくれるコマンドです。

`npm install mozjpeg`(JPEG、PNG、GIF、SVGなどの画像の画質を落とすことなく
サイズを圧縮する事ができるエンコーダー)と打ち込みmozjpegをインストールする事でエラーが解消しました。
　　

 ■ 参考にしたサイト：[stack overflow Error:Error in plugin "gulp-imagemin"](https://github.com/imagemin/imagemin/issues/344)


 

# 3.Error: Node Sass does not yet support your current environment: Windows 64-bit with Unsupported runtime (88) #

```
Error: Missing binding /path/to/project/node_modules/node-sass/vendor/darwin-x64-64/binding.node
Error: Node Sass does not yet support your current environment: OS X 64-bit with Unsupported runtime (64)

Found bindings for the following environments:
  - OS X 64-bit with Node.js 8.x

This usually happens because your environment has changed since running `npm install`.
Run `npm rebuild node-sass` to download the binding for your current environment.
    at module.exports (/path/to/project/node_modules/node-sass/lib/binding.js:15:13)
    at Object.<anonymous> (/path/to/project/node_modules/node-sass/lib/index.js:14:35)
    at Module._compile (internal/modules/cjs/loader.js:778:30)
```

使用しているモジュールのバージョンが、自身の開発環境でサポートされていない場合に発生します。
私はnode.sassを最新バージョンにダウンロードしていた為、上記の様なエラーメッセージが起こりました。

解決方法としては、node.sassのバージョンをv15.6.0からv14.15.4にダウングレードと
`npm rebuild node-sass`のコマンドを叩く事で解決しました。


■参考サイト：[stack overflow Error: Node Sass does not yet support your current environment](https://stackoverflow.com/questions/64612707/node-sass-does-not-yet-support-your-current-environment-windows-64-bit-with-uns)]




# 4.Error in plugin "gulp-imagemin" #

```
Error in plugin "gulp-imagemin"
```

これは、gulp-imageminが入っていない場合に起きるエラーですので、`npm install mozjpeg`のコマンドを打ち込みエラーが解消します。




# 5.SyntaxError: Identifier '<変数名>' has already been declared#

このエラーの内容は、変数が二重に宣言されているという意味です。
私の場合`SyntaxError: Identifier 'imageminPngquant' has already been declared`と出ており、var imageminPngquant = require('imagemin-pngquant');
が二重で指定されていた為、先頭行の変数を削除する事でエラーが解消しました。


私の場合、imageminPngquantが二重で指定されていたので
「var imageminPngquant = require('imagemin-pngquant');」を削除することで、エラーが解消しました。

　


# 6.ERR! missing script: start #

```
npm ERR! missing script: start

npm ERR! A complete log of this run can be found in:
npm ERR!     /Users/saigowtham/.npm/_logs/2020-07-27T05_56_13_752Z-debug.log
```

これは、package.jsonの`scripts.start`が無いことが原因で起こるエラーです。
package.json内に下記コマンドを打つことで解消します。

```
"scripts": {
   "start": "実行するプログラム.js"
},
```




# 7.Error: Cannot find module 'gulp-imagemin'#

```
Error: Cannot find module 'gulp-imagemin'
```

このエラーの内容は、呼び出しているモジュール内にpngquant-binがみつからないと言われています。
その為、 `npm install gulp-imagemin`を実行することでエラーが解消します。




私が遭遇したエラーは以上となります。
gulpは初心者の為、もし間違いがあればご指摘頂けると助かります。