仕事で、node-sassを使うことになったので、インストール手順をまとめます。
■環境
OS: macOS Mojave 10.14.5
VirtualBox: 6.0.10
Vagrant: 2.2.5
ゲストOS: CentOS7
Node.js: v12.13.0
nvm: v0.35.0
nvmのインストール
nvmはNode.jsのバージョン管理(インストール・切り替え)ができるツールです。
githubに書いてある通りにインストールしていきます。
https://github.com/nvm-sh/nvm
$ curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.35.0/install.sh | bash
$ export NVM_DIR="$([ -z "${XDG_CONFIG_HOME-}" ] && printf %s "${HOME}/.nvm" || printf %s "${XDG_CONFIG_HOME}/nvm")"
$ [ -s "$NVM_DIR/nvm.sh" ] && \. "$NVM_DIR/nvm.sh"
$ nvm -v
Node Version Manager (v0.35.0)
バージョンが表示されれば、インストールOK。
Node.jsインストール
nvmがインストールできたので、Node.jsをインストールします。
$ nvm install --lts
--ltsをつけることで、最新のLTSをインストールできます。
LTSとは、Long Term Supportの略で、「長期サポート」的な意味で、ダウンロードページに「推奨版」と書いてあります。
https://nodejs.org/ja/download/
記事執筆時点でのLTSは12.13.0。
ちなみに、下記のコマンドでインストールできるバージョン一覧を確認できます。
$ nvm ls-remote
バージョンが表示されれば、インストールOK。
$ node -v
v12.13.0
node-sassのインストール
Node.jsがインストールできたので、次にnode-sassをインストールします。
npmというコマンドを使いますが、これはNode.js用のパッケージマネージャーです。
(Node.jsをインストールすれば使用できます。)
$ npm install -g node-sass
オプションに-gを付ける事で、グローバルインストールできます。
package.jsの編集
package.jsというファイルができているので、下記のように記述します。
これは「npm run start」というコマンドを使って、package.json の scripts に指定された内容を実行するためです。
これにより、sassの自動コンパイルが可能になります。
"scripts": {
"watch:sass": "node-sass src/sass -o dist/sass -w -r --output-style compact"
}
この場合、src/sassディレクトリ内の監視をスタートし、Sassファイルが更新されたらコンパイルします。
nodeの起動
起動します。
$ npm run start
下記のコマンドでもOKです。
$ npm start