Skip to main content

次のタグが付いている話題の回答:

5
承認済み

babelでトランスパイルをしても元ファイルとほぼ同じファイルが出力されてしまう

はい。あなたのgulpで、babelはきちんと動いています。 では、なぜ「あなたが求めている変換」は行われなかったのでしょうか。 まずはREADMEちゃんと読みましょうね。 https://www.npmjs.com/package/gulp-babel このサンプルにあるように、 .pipe(babel({ presets: ['es2015'] })) とすればes2015→...
hinaloe's user avatar
  • 4,751
4
承認済み

gulpでbabelのタスクが繰り返し大量に実行されてしまう

ログからは、babel babeltrance babelwatch の3つのタスクが繰り返し実行されていることが読み取れます。これらのタスクを見てみましょう。 gulp.task('babeltrance', function() { gulp.src('dest-after/js/babel/*') .pipe(plumber()) .pipe(babel({ ...
unarist's user avatar
  • 1.5万
4
承認済み

SyntaxError: Unexpected token -

Javascriptの関数名に使える記号は、ドル記号($)とアンダースコア(_)だけです。 マイナス記号(-)は使えません。 ところが、質問のコードでは function browser-sync() とマイナス記号が使われているので"Unexpected token -"(使われていないはずの記号 - が見つかりました)とのエラーが出たのです。 <修正案> function ...
Fumu 7's user avatar
  • 4,231
4

'node_modules' は、内部コマンドまたは外部コマンド、 操作可能なプログラムまたはバッチ ファイルとして認識されていません。

質問者です。すみません 結局windows なのが原因だったようで、package.jsonのpathのところにある” を\でエスケープしてみたところ解決したようです。 閲覧くださった方々、ありがとうございます。
user31705's user avatar
4
承認済み

gulp 意図したフォルダにsassがコンパイルされない

.pipe(gulp.dest(dest.root)) ではなく .pipe(gulp.dest('dest.root'))となっていることが原因です。
Faily Feely's user avatar
  • 2,883
3
承認済み

'default' errored after

以下のように gulpfile.js, package.json に対して修正を行います。 src 変数に root プロパティを追加します。 sass_style, watchFiles 関数内の src.scss を src.sass_style に修正します。 watchFiles, browser_sync 関数内に done 関数を記述します。 gulp-autoprefixer を ...
supa's user avatar
  • 5,391
3

gulp-rsync での同期時に error in rsync protocol data stream (code 12) が発生する

同期に伴うファイルやフォルダの作成にも適切な権限が必要です。 コピー先に指定している [email protected]:/var/www/yamatodaiwa.com ですが、 そもそも /var/www は一般的に root 以外のユーザーで書き込みができないようになっています。 例: $ ls -ld /var/www drwxr-xr-x 4 root root ...
cubick's user avatar
  • 2.1万
2
承認済み

autoprefixerでgridを有効にしているのにIE11でレイアウトが崩れる

Autoprefixer の grid オプションの true は、 no-autoplace の別名です。しかし、 true という表記は廃止予定になっているため、今後 Autoprefixer を導入する場合、使用するべきではありません。 Options Function autoprefixer(options) returns a new PostCSS plugin. ...
supa's user avatar
  • 5,391
2
承認済み

gulpfile.js で BrowserSync を使用すると "is not a PostCSS plugin" というエラーが出る

Browser Sync は PostCSS のプラグインではないからです。 基本的には何のプラグインでもありません。 browser-sync モジュールは、開発用のサーバを作成する為の API と、単独で動作するコマンドの両方を提供します。 API は Gulp と協調して動作させるのに便利な機能があり、他のモジュールを介さずgulpfile.js で使用されますが、Gulp ...
mjy's user avatar
  • 1.2万
2
承認済み

gulpの自動圧縮を実行しないようにしたい。

その処理はbabelによって行なわれています。自動圧縮を行わないようにするには、babelのcompactオプションをfalseに設定します。 具体的には、gulp-babelを使用している以下の部分に書き加えます。 gulp.task('babeltrance', function() { gulp.src('./babel-before/*.js', ['babeltrance']) ...
Faily Feely's user avatar
  • 2,883
1

macOS で gulp の環境構築時に .bashrc が見つからない

homeフォルダ内で .bash_profile のファイルは見つかりますが、 .bashrc のファイルが見つかりません。 その前に、最近のMacOSのターミナルでのデフォルトシェルはzshです。 環境変数SHELLの内容を確認してください。 ~ $ echo $SHELL /bin/zsh zshの場合、環境設定ファイルは、.zprofile、および、.zshrcになります。
endymion's user avatar
  • 347
1
承認済み

srcを変更したところなぜか反応しなくなりました。

・下記のようにしたところうまくいきました。 第二引数が足りなかった。 gulp.task('babeltrance', function() { gulp.src('./*.js', ['babeltrance']) .pipe(plumber()) .pipe(babel({ presets: ['es2015'], })) .pipe(gulp.dest('./babel-dest')); }...
nicomesecond's user avatar
1

gulp-sassを実行すると Invalid CSS のエラーが発生する

解決案① 拡張子をsassとして記載する場合は、インデントで調整して階層構造を表現してください。 html background:red; body background:blue; 解決案② 記載内容から"{}"を入れ子で書きたいのかと思います。その場合はファイルの拡張子をscssに変えてください。 style.sass -> style.scss ...
maot's user avatar
  • 1,012
1
承認済み

csscombの設定について。思ったように整形してくれません。

根本的な解決にはならないかもですが・・・ csscombで整形したあとに出力する前にgulp-sassでコンパイルしてあげると思う通りに整形されます。 var sass = require("gulp-sass"); gulp-sassを呼んであげて gulp.task('comb', function () { return gulp.src('./src-before/**/*.css'...
user20169's user avatar
1
承認済み

Gulp で起動した BrowserSync に出力先ディレクトリの更新時にもれなくリロードさせたい

gulp.watch("./dest/**/*").on('change', browserSync.reload); とりあえず、上記のように出力先ディレクトリ(browser-syncで提供するディレクトリ)全体をwatchするのはいかがでしょうか。 もちろん、ソースの方は下のように、また別に監視するという事で。 gulp.watch('./src/css/**/*.css', ["css"...
mjy's user avatar
  • 1.2万
1
承認済み

sourcemapsをpostcssで使うことはできないのでしょうか?

sourcemapsをpostcssで使うことはできないのでしょうか? 使用出来ます。 公式の README でも gulpの使用例では、gulp-sourcemapsが使われています。 https://github.com/postcss/postcss#gulp gulp.task('css', function () { var postcss = require('...
mjy's user avatar
  • 1.2万
1

Disconnected from BrowserSyncにすぐになってしまいます。

BrowserSyncのCSSリロードについては、毎回ページごとリロードするのではなく、ファイルの更新の際にCSSのみ差し替える事が可能です。 (browserSync.reloadはたしかBS上で開いているすべてのページをリロードしますよね。) BrowserSync初期化時のfilesオプションや、browserSync.streamを用いることでこれが可能です。 ...
hinaloe's user avatar
  • 4,751
1
承認済み

Disconnected from BrowserSyncにすぐになってしまいます。

こういう問題は難しいですね。 デバッグ作業のように原因を絞り込んでいくしかないと思います。 以下は直接の回答ではなく、作業の例です。 HTML を最低限の物にしてみる <!DOCTYPE html> <html> <head></head> <body> <h1>Test</h1> </body&...
mjy's user avatar
  • 1.2万
1
承認済み

autoprefixerを導入したのですが、エラーが出ます。

autoprefixer をreuireしてないため、ですね。 PostCSSのプラグインとして autoprefixer を使うのであれば gulp-autoprefixer ではなく autoprefixerの方になるかと思います。 各requireの最後あたりに var autoprefixer = require('autoprefixer'); を追加します。 ...
hinaloe's user avatar
  • 4,751
1
承認済み

cssnext から rem に自動で px を加える機能をなくしたい

端的には下記のようになります。 postcss([ cssnext({ features: { rem: false } }) ]) (例示コードは Gulp での利用を想定しています) cssnext の話なので、まずは cssnext のドキュメントをあたるのがよいです。 browsers ...
mjy's user avatar
  • 1.2万

無効化に投票