タグ付けされた質問 「gulp」

最も人気のあるJavaScriptパッケージマネージャー、バンドラー、タスクランナーに関する私の知識を要約しようとしています。私が間違っている場合は修正してください： npm＆bowerはパッケージマネージャーです。依存関係をダウンロードするだけで、自分でプロジェクトを構築する方法がわかりません。彼らは何を知っていることは呼び出すことですwebpack/ gulp/ gruntすべての依存関係を取得した後。 bowerに似てnpmいますが、フラット化された依存関係ツリーを構築します（npm再帰的に行うのとは異なります）。意味npmが、（数回同じフェッチすることができる）、各依存性をフェッチに依存関係をbower手動でサブ依存性を含むことを期待。時々bower、npmフロントエンドとバックエンドでそれぞれ一緒に使用されます（フロントエンドで各メガバイトが重要になる場合があるため）。 gruntおよびgulp自動化することができる自動化、すべてのタスクランナー（すなわち、コンパイルCSS /サス、最適化画像は、バンドルを作成し、縮小化/ transpileこと）です。 grunt対gulp（maven対、gradleまたは構成対コード）。Gruntは、個別の独立したタスクの構成に基づいており、各タスクはファイルを開いたり、処理したり、閉じたりします。Gulpは必要なコード量が少なく、Nodeストリームに基づいているため、パイプチェーンを構築して（同じファイルを再度開くことなく）高速化できます。 webpack（webpack-dev-server）-私にとっては、すべてのJS / CSSウォッチャーを忘れることができる変更のホットリロードを備えたタスクランナーです。 npm/ bower+プラグインはタスクランナーを置き換える場合があります。それらの機能は交差することが多いため、gulp/ grunt以上のnpmプラグインを使用する必要がある場合は、さまざまな影響があります。しかし、タスクランナーは複雑なタスクに適しています（たとえば、「ビルドごとに、バンドルを作成し、ES6からES5にトランスパイルし、すべてのブラウザーエミュレーターで実行し、スクリーンショットを作成し、ftp経由でドロップボックスにデプロイします」）。 browserifyブラウザのノードモジュールをパッケージ化できます。browserify対nodeさんはrequire、実際にあるCommonJS対AMD。 質問： webpack＆とはwebpack-dev-server？公式ドキュメントには、それがモジュールバンドラーであると記載されていますが、私にとってはそれは単なるタスクランナーです。違いは何ですか？ どこで使用しbrowserifyますか？node / ES6インポートでも同じことはできませんか？ するときは、使用するgulp/ grunt上npm+プラグイン？ 組み合わせを使用する必要がある場合は例を提供してください

1886 gruntjs  npm  gulp  bower  webpack 

次のようなスニペットで： gulp.task "coffee", -> gulp.src("src/server/**/*.coffee") .pipe(coffee {bare: true}).on("error",gutil.log) .pipe(gulp.dest "bin") gulp.task "clean",-> gulp.src("bin", {read:false}) .pipe clean force:true gulp.task 'develop',['clean','coffee'], -> console.log "run something else" でdevelopタスク私が実行したいcleanとそれが行わだ後、実行coffeeし、それが終了したとき、何か他のものを実行します。しかし、それを理解することはできません。この作品は動作しません。お知らせ下さい。

398 javascript  node.js  coffeescript  gulp 

私はを使用gulpして、変更とブラウザーの同期を維持するためのコンパイルとブラウザーの同期に使用するWebサイトに取り組んでいます。 gulpタスクはすべてを適切にコンパイルしますが、Webサイトではスタイルを確認できず、コンソールに次のエラーメッセージが表示されます。 ' http：// localhost：3000 / assets / styles / custom-style.css 'からのスタイルの適用は拒否されました。MIMEタイプ（ 'text / html'）はサポートされているスタイルシートMIMEタイプではなく、厳密なMIMEチェックが有効になっているためです。 今、私はこれがなぜ起こるのか本当に理解していません。 HTMLには次のようなファイルが含まれています（これは正しいと確信しています）。 <link rel="stylesheet" type="text/css" href="assets/styles/custom-style.css"/> そしてスタイルシートは今のところBootstrapとfont-awesomeスタイルの融合です（まだカスタムはありません）。 これもフォルダ構造なので、パスも正しいです。 index.html assets |-styles |-custom-style.css しかし、エラーが発生し続けます。 どうなり得るか？これはおそらくgulp / browsersyncの何かですか？

383 html  css  gulp  mime-types  browser-sync 

通常、Gulpのタスクは次のようになります。 gulp.task('my-task', function() { return gulp.src(options.SCSS_SOURCE) .pipe(sass({style:'nested'})) .pipe(autoprefixer('last 10 version')) .pipe(concat('style.css')) .pipe(gulp.dest(options.SCSS_DEST)); }); コマンドラインフラグをgulp（タスクではありません）に渡して、それに基づいて条件付きでタスクを実行させることは可能ですか？例えば $ gulp my-task -a 1 そして、私のgulpfile.jsで： gulp.task('my-task', function() { if (a == 1) { var source = options.SCSS_SOURCE; } else { var source = options.OTHER_SOURCE; } return gulp.src(source) .pipe(sass({style:'nested'})) .pipe(autoprefixer('last 10 version')) .pipe(concat('style.css')) .pipe(gulp.dest(options.SCSS_DEST)); });

369 javascript  node.js  gulp 

npm installでノードモジュールをインストールした後、コマンドプロンプトでgulp sass-watchを実行しようとしました。その後、私は以下の応答を得ました。 [18:18:32] Requiring external module babel-register fs.js:27 const { Math, Object, Reflect } = primordials; ^ ReferenceError: primordials is not defined これを試してみてください npm -g install gulp-cli

366 node.js  sass  gulp  gulp-sass 

gulpに関する2つのマニュアルによると、最初にgulpをグローバルに（-gフラグを付けて）インストールし、次にローカルにもう一度インストールする必要があります。なぜこれが必要なのですか？

292 javascript  gulp 

google webスターターキットを使用したいと思います。node.js v0.12.0をインストールしました。node-sass＆gulp。 そして走った： $ sudo npm install 入力するとgulp serve、このエラーが発生しました： Using gulpfile ~/web-starter-kit/gulpfile.js Starting 'styles'... 'styles' errored after 93 ms Error: `libsass` bindings not found. Try reinstalling `node-sass`? at getBinding nodeとgulpを再インストールしましたが、これは役に立ちません。 次に何をすればいいですか？

263 node.js  sass  gulp 

npmを介してgulp.jsをインストールした後、インストール先と同じディレクトリからコマンドをno command 'gulp' found実行するとエラーgulpが表示されます。 node_modules/.bin/ディレクトリの下を見ると、gulpそこに実行可能ファイルがあります。 npmのインストールに何か問題がありますか？

250 javascript  node.js  npm  gulp 

私はすべてのカスタム.JSファイル（ベンダー以外のライブラリ）を連結して醜くするgulp rjsタスクを持っています。 私がやろうとしていることは、このタスクからいくつかのファイル/ディレクトリ（コントローラとディレクティブ）を除外することです。 わたしの木 - application - resources - js main.js - vendor - jquery - modernzr - angular - controllers - controller1 - controller2 - controller3 - directives - directives1 - directives2 - directives3 - widgets - widget1 - widget2 - widget3 - widget4 - modules - modules1 - …

227 requirejs  gulp  minify  uglifyjs 

私はグローバルとローカルの両方でgulpをインストールしました npm install gulp npm install gulp -g npm install gulp-util npm install gulp-util -g gulpを実行しようとすると、 'gulp' is not recognized as an internal or external command, operable program or batch file. npm list gulp（または-g）を実行gulp@3.7.0すると、グローバルまたはローカルのgulpインストールの場所がわかります。 私はnode gulpfile.jsgulpfile をポイントして実行してみましたが、エラーなしで実行され、もちろんで始まりrequire('gulp')ます。 Windows（8.1）でgulpを動作させるための提案はありますか？

223 windows  node.js  gulp 

コマンドラインのgulpメッセージを介して実行している次のgulpfile.jsがあります。 var gulp = require('gulp'); gulp.task('message', function() { console.log("HTTP Server Started"); }); 次のエラーメッセージが表示されます。 [14:14:41] Using gulpfile ~\Documents\node\first\gulpfile.js [14:14:41] Starting 'message'... HTTP Server Started [14:14:41] The following tasks did not complete: message [14:14:41] Did you forget to signal async completion? Windows 10システムでgulp 4を使用しています。ここからの出力ですgulp --version： [14:15:15] CLI version 0.4.0 [14:15:15] Local version …

212 gulp 

moment.jsWebpackを使用しているときに、すべてのロケール（英語のみが必要です）のロードを停止できる方法はありますか？私はソースを探していますが、それhasModuleが定義されている場合、それはwebpackの場合、常にrequire()すべてのロケールを試行します。私はこれを修正するためにプルリクエストが必要だと確信しています。しかし、webpack設定でこれを修正できる方法はありますか？ 以下は、momentjsをロードするための私のwebpack設定です。 resolve: { alias: { moment: path.join(__dirname, "src/lib/bower/moment/moment.js") }, }, それなら、どこでも必要なときに、ただやるだけですrequire('moment')。これは機能しますが、バンドルに約250 kBの不要な言語ファイルが追加されます。また、私はmomentjsとgulpのバウアーバージョンを使用しています。 また、これがwebpack設定で修正できない場合は、ロケールをロードする関数へのリンクがあります。ステートメントに追加&& module.exports.loadLocalesしてみましたが、ifwebpackは実際には機能しません。それはrequire何があっても問題ありません。今は正規表現を使用していると思いますので、どうすれば修正できるかわかりません。

199 javascript  gulp  momentjs  webpack 

通常、コンソールからgulpタスクを実行できますgulp mytask。とにかくパラメーターをgulpタスクに渡すことができますか？可能であれば、例を示してください。

194 gulp 

たとえば、バックボーンなどでプロジェクトを構築していて、スクリプトを特定の順序でロードする必要があるとします。 underscore.jsロードする必要があるとしますbackbone.js。前にロードする必要があります。 スクリプトを連結して正しい順序にするにはどうすればよいですか？ // JS concat, strip debugging and minify gulp.task('scripts', function() { gulp.src(['./source/js/*.js', './source/js/**/*.js']) .pipe(concat('script.js')) .pipe(stripDebug()) .pipe(uglify()) .pipe(gulp.dest('./build/js/')); }); 私のにはスクリプトの正しい順序がありsource/index.htmlますが、ファイルはアルファベット順に整理されているため、gulpはunderscore.js後に連結しますbackbone.jsに、私のスクリプトの順序はsource/index.html重要ではないため、ディレクトリ内のファイルを調べます。 それで誰かがこれについて考えを持っていますか？ 私が持っている最高のアイデアは、ベンダースクリプトの名前を1、2、3それらを適切な順序を与えることが、私はこれが好きかどうかはわかりません。 さらに知りながら、Browserifyは優れたソリューションであることを発見しました。最初は面倒なことかもしれませんが、素晴らしいものです。

192 javascript  gulp 

TypeScriptとAngularアプリケーションを使用して、毎回tsファイルをトランスパイルせずに開発サーバーを実行しようとしています。で実行できることがわかりましたが、gulp ts-nodewatchの.ts場合と同じように、ファイルを監視してアプリ/サーバーをリロードしたいと思います。

192 typescript  angular  gulp  development-environment  nodemon