開発しやすい環境の作り方~Web系~ - Qiita

はじめに 何か記述等にミスやこうした方がいいとのことがあればコメントで教えてくださると幸いです。 目的 開発を円滑するために行ったら良いと思われることについての紹介 概要 タスクランナーのGulpを用いて開発の効率化を図る。 内容は、SassやPugで書いた内容を変換し、ファイルの内容が変更された場合は自動的にブラウザのリロードを行う流れを作成する。 Windows 8.1 npm 2.15.1 node 4.4.3 gulp 3.9.1 環境構築 フォルダ構成 まず初めに、フォルダ構成を作成します。今回の場合私はポートフォリオサイト作ろうと思っていたので以下のようにしました。 今回はこのフォルダ構成で説明していきます。 root/ ├ js/ | └ index.js ├ css/ | └ style.css ├ img/ | └ hoge.png ├ sass/ | └ style.s

[KitAMiyAko]

“var gulp = require("gulp"); var sass = require("gulp-sass"); var plumber = require("gulp-plumber"); var browserSync = require("browser-sync"); var notify = require("gulp-notify"); var pug = require("gulp-pug"); gulp.task('default', ['sass', 'browser-sync', 'pug', 'watch']); //sassとpugの監視