問題タブ [laravel-mix]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票する
2 に答える
3369 参照

npm - Laravel Mix、NPMを介してLaravelで羽のアイコンを使用する方法

私はlaravel環境で羽のアイコンを使用しようとしています.npmを介して行うと思いました。私はそれを機能させることができなかったので、誰かがこれがどのように機能するかを理解するのを手伝ってくれますか? 私はパッケージの操作に非常に慣れていません。

インストールしました

次にconst feather = require('feather-icons')、resource/app.js に追加しました。

次に、「npm run dev」を実行します

  1. この Web サイトにリストされているアイコン (サークルなど) を自分のページに表示するにはどうすればよいですか?

  2. 私が上で行ったことは正しいですか?

ありがとう

0 投票する
0 に答える
1120 参照

ubuntu - エラー - プラットフォーム「linux」は fsevents と互換性がありません - laravel-mix 4.0.14 にアップグレードした後

laravel-mix 4.0.14にアップグレードした後、実行しています

そして、私は得ています:

糸チェック v1.13.0

error fsevents@1.2.7: プラットフォーム "linux" はこのモジュールと互換性がありません。

エラー 互換性のないモジュールが見つかりました

ご覧のとおり、fseventsはMac OSXに関するパッケージですが、Ubuntu 18.04を使用しています

私は持っている:

"fsevents": "^1.2.4",

package.json の依存関係

NPM バージョン: 6.7.0

ノードのバージョン: 11.9.0

どうすればこれを取り除くことができますか?

v.2.1.14 にダウングレードすると、このエラーはなくなりましたが、監査アラートが表示されます

0 投票する
1 に答える
1811 参照

vuetify.js - Vuetify テーマのカスタマイズが Laravel Mix で機能しない

LaravelパッケージでVuetifyと一緒にVueJSでAPIインターフェースを構築しています。Vuetify ドキュメントに従ってmain.styl、メイン テーマのスタイラス ファイル ( ~vuetify/src/stylus/theme)、オーバーライド、およびアプリ ファイルのインクルード ( ~vuetify/src/stylus/main.styl) をこの順序で含むファイルを作成しました。これにより、色のオーバーライドが追加されるはずですが、これは起こりません。

スタイラス ファイルは次のとおりです。

そして私webpack.mix.jsのように:

(例ではに設定されている)$material-theme変数を$material-darkand$themeにも設定しようとしましたが、どちらも機能しませんでした...

スタイラスプラグインなどをすべてインストールするようにしましたが、スタイルシートをコンパイルするときに糸はまったく文句を言いません(意図的にエラーを引き起こした場合はそうです)。ただし、コンパイルされたスタイルシートには、変更したテーマ変数が含まれていません。それでも、私のカスタマイズはまったく適用されません。CSS ファイルには、カスタム カラー コードなどが含まれていません。

なぜこれが適切に機能しないのか、誰にも分かりますか?

0 投票する
1 に答える
2353 参照

laravel - npm run production を使用して本番環境でアセットをコンパイルできない

npm run production正常に実行されません。node_modules フォルダーを削除して実行しようとしましたnpm installが、まだ何もありません。また、システムから npm をアンインストールしてインストールしようとしましたが、まだ同じ問題が発生しています。

しかし、時計は正常に動作していますが、生産ではありません。

プロダクション スクリプトは次のことを行います。

npm バージョン 6.7.0 と nodejs バージョン 8.11.4 を使用しています。スクリプトは、npm エラー ログに次のエラーをコンソールします。

0 info it worked if it ends with ok 1 verbose cli [ '/usr/bin/node', '/usr/local/bin/npm', 'run', 'prod' ] 2 info using npm@6.7.0 3 info using node@v8.11.4 4 verbose run-script [ 'preprod', 'prod', 'postprod' ] 5 info lifecycle @~preprod: @ 6 info lifecycle @~prod: @ 7 verbose lifecycle @~prod: unsafe-perm in lifecycle true 8 verbose lifecycle @~prod: PATH: /usr/local/lib/node_modules/npm/node_modules/npm-lifecycle/node-gyp-bin:/var/www/html/****/node_modules/.bin:/usr/local/sbin:/usr/local/bin:/usr/sbin:/usr/bin:/sbin:/bin:/usr/games:/usr/local/games 9 verbose lifecycle @~prod: CWD: /var/www/html/**** 10 silly lifecycle @~prod: Args: [ '-c', 'npm run production' ] 11 silly lifecycle @~prod: Returned: code: 1 signal: null 12 info lifecycle @~prod: Failed to exec prod script 13 verbose stack Error: @ prod: npm run production 13 verbose stack Exit status 1 13 verbose stack at EventEmitter.<anonymous> (/usr/local/lib/node_modules/npm/node_modules/npm-lifecycle/index.js:301:16) 13 verbose stack at emitTwo (events.js:126:13) 13 verbose stack at EventEmitter.emit (events.js:214:7) 13 verbose stack at ChildProcess.<anonymous> (/usr/local/lib/node_modules/npm/node_modules/npm-lifecycle/lib/spawn.js:55:14) 13 verbose stack at emitTwo (events.js:126:13) 13 verbose stack at ChildProcess.emit (events.js:214:7) 13 verbose stack at maybeClose (internal/child_process.js:925:16) 13 verbose stack at Process.ChildProcess._handle.onexit (internal/child_process.js:209:5) 14 verbose pkgid @ 15 verbose cwd /var/www/html/**** 16 verbose Linux 4.18.0-11-generic 17 verbose argv "/usr/bin/node" "/usr/local/bin/npm" "run" "prod" 18 verbose node v8.11.4 19 verbose npm v6.7.0 20 error code ELIFECYCLE 21 error errno 1 22 error @ prod: npm run production 22 error Exit status 1 23 error Failed at the @ prod script. 23 error This is probably not a problem with npm. There is likely additional logging output above. 24 verbose exit [ 1, true ]

0 投票する
1 に答える
6467 参照

laravel - モジュールが見つかりません: エラー: 'flag-icon-css' を解決できません

この管理パネルhttps://coreui.io/ (無料版) を laravel プロジェクトにインストールします。これには、次の依存関係を持つ package.json ファイルが含まれています。

したがって、これらの依存関係を package.json に入れて実行 npm installし、npm run dev. 私のプロジェクトのpackaje.jsonは

しかし、結果として、次のことがわかります。

ここに画像の説明を入力

それで、どうすれば修正できますか?なにが問題ですか?

0 投票する
0 に答える
265 参照

laravel - "xxx.scss" は Laravel Mix の SourceMap エラーにありません

私はLaravelのドキュメントに従っており、このファイル構造を持っています:

ここに画像の説明を入力

app.scss私は持っています:

そして、style12.scss私がインポートしようとするいくつかのcssコードで。

実行するnpm run devと、次のエラーが表示されます。

また、ここに私のwebpack.mix.jsがあります:

どんな助けでも大歓迎です、ありがとう!

0 投票する
0 に答える
466 参照

javascript - Laravel MixワークフローでFullCalendarを使用すると「瞬間が定義されていません」というエラーが発生する

FullCalendar (およびその依存関係MomentJs )を含むカスタム WordPress テーマで作業しています。Laravel Mixを使用して、アセットと JavaScript モジュールを「コンパイル」しています。moment()FullCalendar モジュールをインポートした後でモジュール内の関数を呼び出すと、エラーが発生する

「Uncaught ReferenceError: MonthView.viewRender でモーメントが定義されていません」... など

Moment モジュール (FullCalendar の前) を変更せずに明示的にインポートしようとしました。機能する唯一の方法は、明示的に moment.js をページに含まれるスタンドアロン ファイルとして追加することです (app.js で「コンパイル」せずに)。FullCalendar と MomentJS の最新バージョン。明らかに実行します:npm install moment fullcalendar

app.js (フラグメント)

calendar.js (フラグメント)

Laravel Mixでコードを束ねて、カレンダーモジュールでMomentの関数をエラーなく使えるようにしたいです。

0 投票する
0 に答える
73 参照

javascript - webpack 経由で生成されたファイル間で複製されたコードの自動読み込み

私のアプリにはかなりのapp.js量 (6,000 行、9 MB) があり、効率のために分割し、必要なときに必要な場所で小さなチャンクにロードする必要があります。私がやろうとしているのは、最初に設定されたコンポーネントを使用するいくつかのページにのみ 2 番目の .js ファイルをロードすることです。例えば:

webpack.mix.js

このアプローチを使用するsponsor.jsと、長さは約 600 行 (私のコンポーネントは約 100 行しかありませんが) になり、そのうちの 500 行は webpack の自動読み込みコードの束のように見えます。技術的には、このコードはすでに初期のapp.js. webpack の自動読み込みを複製せずに、アプリの別のセクション用に vue コンポーネントの個別のバンドルを作成するにはどうすればよいですか?

0 投票する
2 に答える
2756 参照

laravel - laravel mixファイルへのデータテーブルの追加

このドキュメントdatatablesの助けを借りて npmをインストールしましたが、データテーブル cssおよびjs ファイルを自分のファイルに追加する方法がわかりません。app.cssapp.js

NPM によってダウンロードされたファイル

1

コード

私のwebpack.mix.js

何か案が?

0 投票する
1 に答える
533 参照

javascript - インライン JavaScript で webpack モジュールを使用する方法

私は経験の浅い Web 開発者であり、特に JavaScript に関してはそうです。最近、私はそれを修正しようとしてきました.Laravelは私の選択したフレームワークなので、「古い」スタイルから変更しようとしています:

より良いものに。Laravel を使用する場合、論理的なステップは、Webpack に依存する Mix を使用することです。

試行錯誤を繰り返した結果、基本的なセットアップが機能するようになりました。必要に応じてモジュールのデフォルト設定を変更するための settings.js ファイルと、すべてのページで利用できるようにしたいカスタム関数用の app.js ファイルがあります。また、ベンダー モジュールを vendors.js ファイルに分離しています。

したがって、bootstrap.js ファイルには次のものが含まれます。

webpack.mix.js ファイルには次のものがあります。

また、マスター レイアウトには、` の直前に次のスクリプトがあります。

この設定はうまくいっているようですが、最後にもう 1 つ問題があり、私には理解できないようです。また、特定のページに限定された機能 (既定以外の設定でのピッカーの初期化、カスタム フォームの動作など) のために、特定のページに JavaScript を追加します。そのため、一部のページには の前に余分な<script type="text/javascript"> [custom code] </script>セクションがあり</body>ます。

ただし、そこにあるコードはモジュールにアクセスでき$('.input-daterange').datepicker();ません。入力をブートストラップ日付ピッカー インスタンスとして初期化する必要がありますが、そうではありません。もちろん、「古いスタイル」を使用するとうまくいきました。今、私はTypeError: undefined is not a function (near '...$('.input-daterange').datepicker...')エラーが発生しています。

だから私の問題は次のとおりです:HTMLファイルに埋め込まれたスクリプトで使用される必要なモジュールをインポートするにはどうすればよいですか?

PS:この質問を書き終えたとき、たまたま解決策に出くわしました。それでも投稿することにしたのは、a) 他の誰かを助けるかもしれないし、b) これにアプローチするより良い方法があれば、それについて聞きたいからです.