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

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

新規登録して質問してみよう
ただいま回答率
85.48%
gulp

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

Q&A

解決済

1回答

2819閲覧

【Gulp】Gulpのコンパイルがwindowsだと動いてmacだと動きません

dotQ

総合スコア7

gulp

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

0グッド

0クリップ

投稿2017/04/15 17:04

編集2017/04/16 09:12

###前提・実現したいこと
Gulpでのコンパイル後のファイルが出力されない。
windows10の環境だと動作するが、MACに移動したらコンパイルされないです。
Macでも動作するようにしたいです。
環境設定が苦手な故、ご助言お願いいたしいです。
###発生している問題・エラーメッセージ
エラーメッセージ
なし

コンパイル後のファイルが出力されない
###該当のソースコード
gulpfile.js

js

1//gulp 2var gulp = require('gulp'); 3//sass 4var sass = require('gulp-sass'); 5//plumber 6var plumber = require('gulp-plumber'); 7//pug 8var pug = require('gulp-pug'); 9 10// path 11var paths = { 12 'pug' : ['src/**/*.pug', '!src/**/_*.pug'], 13 'pugWach' : 'src/**/*.pug', 14 'sass' : 'src/Scss/**/*.scss', 15 'sassDist' : 'dist/css/', 16 'copy' : [ 'src/images/**', 'src/js/*.js'], 17 'dist' : 'dist/', 18 'url' : './src/url.pag' 19} 20 21//sass 22gulp.task("sass", function() { 23 return gulp.src(paths.sass) 24 .pipe(plumber()) 25 .pipe(sass()) 26 .pipe(gulp.dest(paths.sassDist)); 27}); 28 29//pug 30gulp.task('pug', function() { 31 return gulp.src(paths.pug) 32 //pretty: true 出力のコードを、改行をありにする 33 .pipe(pug({pretty: true})) 34 .pipe(gulp.dest(paths.dist)); 35}); 36 37gulp.task( 'copy', function() { 38 return gulp.src( 39 paths.copy, 40 { base: 'src' } 41 ) 42 .pipe(gulp.dest(paths.dist)); 43} ); 44 45//watch 46gulp.task('default',['copy', 'pug', 'sass'], function(){ 47 48 gulp.watch(paths.copy, function(e) { 49 console.log(e.path); 50 gulp.start('copy') 51 }); 52 53 gulp.watch(paths.pugWach, function(e) { 54 console.log(e.path); 55 gulp.start('pug') 56 }); 57 58 gulp.watch(paths.sass, function(e) { 59 console.log(e.path); 60 gulp.start('sass') 61 }); 62 63});

###試したこと
・フォルダ構成をシンプルにする
・npmのバージョンアップ
・npmのキャッシュのクリア
・nodebrewのバージョンアップ
・node.jsのバージョン切り替え(v6.10.2とv.7.2)
・gulp-debugでの結果は、全て 0 でした。
・wachでの変更ファイルのconsole.logは変更されたファイル名が取得できました。でもコンパイルされたファイルは出なかったです。

js

1 gulp.watch(paths.pugWach, function(e) { 2 console.log(e.path); 3 gulp.start('pug') 4 });

・別プロジェクトとして、gulp-sassのみの物を作成しましたが、動作しなかったです。
・書籍からダウンロードしたgulpは動きました。

###補足情報(言語/FW/ツール等のバージョンなど)
より詳細な情報
・環境
macOS Sierra 10.12.3
node v6.10.2
npm 4.5.0
nodebrew 0.9.6 (Homebrewでの管理していないです)

・ファイル階層
src
|--Pug_include
| |--_Alltemp.pug
|--Scss
| |--base
| | |--_base.scss
| |--layout
| | |--_footer.scss
| |--style.scss
|--images
| |--icon01.png
|--index.pug
|--js
| |--jquery-1.12.4.min.js

よろしくお願いいたします。

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

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

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

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

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

CHERRY

2017/04/18 00:50

環境構築の問題と思いますが、MacOS側の環境構築に参考にした本やWebサイトがありましたら、情報を追記してもらえないでしょうか。
dotQ

2017/04/30 11:45 編集

返信が遅くなり申し訳ないです。 ↑の環境を作るのに、参考にしたサイトはログに残ってないです。 現在は環境を変えました。 あれこれ試していて会社の人にも見てもらっても動かないですが、 nodebrewをアンインストールし、 node公式で配布されているnodeをそのまま入れました。 結果エラーメッセージも表示されました。 随分昔に入れた、electolonが残っていて悪さをしているのかもしれないです。 状況が変わってきたので、あれこれ自分で試してみて、 無理でしたら新スレ立てて新しく質問いたします。 折角、ご回答いただいたのに、申し訳ございません。 ありがとうございました。
guest

回答1

0

自己解決

nodebrewをアンインストールし、 node公式で配布されているnodeをそのまま入れました。
結果エラーメッセージも表示されました。
随分昔に入れた、electolonが残っていて悪さをしているのかもしれないです。
状況が変わってきたので、あれこれ自分で試してみてます。

投稿2017/04/30 11:55

dotQ

総合スコア7

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

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

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

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

ただいまの回答率
85.48%

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

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

質問する

関連した質問