カテゴリー: 未分類

gulp導入でやること。忘れちゃうことメモ

[Mac]
Homebrew導入
https://brew.sh

Homebrew cask インストール
$ brew install cask

anyenvインストール
$ git clone https://github.com/riywo/anyenv ~/.anyenv

$ echo ‘export PATH=”$HOME/.anyenv/bin:$PATH”‘ >> ~/.bash_profile
$ echo ‘eval “$(anyenv init -)” ‘ >> ~/.bash_profile

$ exec $SHELL -l して再起動したタイミングで、以下のように怒られたので、

ANYENV_DEFINITION_ROOT(/Users/USERNAME/.config/anyenv/anyenv-install) doesn’t exist. You can initialize it by:
> anyenv install –init

$ anyenv install –init
と入れた。

nodenv入れる
$ anyenv install nodenv

$ exec $SHELL -l
で再起動して動くかチェック

$ nodenv
でうごいてればヨシ。

Node.js インストール
$ nodenv install [推奨バージョン]
推奨バージョンは https://nodejs.org/en/ で調べる。
今回は 12.16.2 だった。

$ nodenv global 12.16.2
nodenv グローバルで、12.16.2 を有効に

このあと、$ node したら、bashでダメいわれた。 “bash: node: command not found” Fu**! …node.jsが入ってない？

よくわからないから インストーラーからインストールしちゃった。
This package has installed:
======

• Node.js v12.16.2 to /usr/local/bin/node
• npm v6.14.4 to /usr/local/bin/npm
  Make sure that /usr/local/bin is in your $PATH.
  ======
  こんなんでてくる。
  

$ node -v したらば、v12.16.2ってでてきて、インストールされていることが確認できら。 PATHがーって出てるけど、$node ででてきたからいいんだろう。

~~~~~~~~~~~~~~~~ここから先は作業ディレクトリに移動~~~~~~~~~~~~~~~~

npm で作業. Node Package Manager

package.json の雛型を生成。 $ npm init -y

いよいよ、gulpのインストール。
npmでgulpを devDependencies でインストール。dependenciesとdevDependenciesがある。今回はウェブサイトの「開発」に使うのでdevDependenciesで。
$ npm install gulp -D して 、ちょい待ち。

==========
WARNってでたので、あとで調べる。
・npm WARN deprecated resolve-url@0.2.1: https://github.com/lydell/resolve-url#deprecated
・npm WARN deprecated urix@0.1.0: Please see https://github.com/lydell/urix#deprecated
・npm WARN gulp-tutorial No repository field.
==========

$ npx gulp -v する。
= = = = = = =
CLI version: 2.2.0
Local version: 4.0.2
= = = = = = =
ってでてた。 …npxってなんなの？→Node.jsにはいっている便利機能で、ショートカットみたいなもの。gulp.jsってインストールしたプロジェクトディレクトリの奥まったところにあるので。 $ npx gulp で、奥っちょにあるgulp.jsを叩いている。

動くかチェック。
gulpのレシピを書く gulpfile.js を中身は空で新規書類としてつくる。@作業ディレクトリ。
で、 $npx gulp 。すると、
[13:24:37] Working directory changed to ~/作業dir
[13:24:37] Using gulpfile ~/作業dir/gulpfile.js
[13:24:37] Task never defined: default
[13:24:37] To list available tasks, try running: gulp –tasks
みたいなのでてくる。なんか動いてるっぽい。ターミナルで Taskがないから、そこだけエラー表示になってた。