問題タブ [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.
npm - Laravel Mix、NPMを介してLaravelで羽のアイコンを使用する方法
私はlaravel環境で羽のアイコンを使用しようとしています.npmを介して行うと思いました。私はそれを機能させることができなかったので、誰かがこれがどのように機能するかを理解するのを手伝ってくれますか? 私はパッケージの操作に非常に慣れていません。
インストールしました
次にconst feather = require('feather-icons')
、resource/app.js に追加しました。
次に、「npm run dev」を実行します
この Web サイトにリストされているアイコン (サークルなど) を自分のページに表示するにはどうすればよいですか?
私が上で行ったことは正しいですか?
ありがとう
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 にダウングレードすると、このエラーはなくなりましたが、監査アラートが表示されます
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-dark
and$theme
にも設定しようとしましたが、どちらも機能しませんでした...
スタイラスプラグインなどをすべてインストールするようにしましたが、スタイルシートをコンパイルするときに糸はまったく文句を言いません(意図的にエラーを引き起こした場合はそうです)。ただし、コンパイルされたスタイルシートには、変更したテーマ変数が含まれていません。それでも、私のカスタマイズはまったく適用されません。CSS ファイルには、カスタム カラー コードなどが含まれていません。
なぜこれが適切に機能しないのか、誰にも分かりますか?
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 ]
laravel - モジュールが見つかりません: エラー: 'flag-icon-css' を解決できません
この管理パネルhttps://coreui.io/ (無料版) を laravel プロジェクトにインストールします。これには、次の依存関係を持つ package.json ファイルが含まれています。
したがって、これらの依存関係を package.json に入れて実行
npm install
し、npm run dev
. 私のプロジェクトのpackaje.jsonは
しかし、結果として、次のことがわかります。
それで、どうすれば修正できますか?なにが問題ですか?
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の関数をエラーなく使えるようにしたいです。
javascript - webpack 経由で生成されたファイル間で複製されたコードの自動読み込み
私のアプリにはかなりのapp.js
量 (6,000 行、9 MB) があり、効率のために分割し、必要なときに必要な場所で小さなチャンクにロードする必要があります。私がやろうとしているのは、最初に設定されたコンポーネントを使用するいくつかのページにのみ 2 番目の .js ファイルをロードすることです。例えば:
webpack.mix.js
このアプローチを使用するsponsor.js
と、長さは約 600 行 (私のコンポーネントは約 100 行しかありませんが) になり、そのうちの 500 行は webpack の自動読み込みコードの束のように見えます。技術的には、このコードはすでに初期のapp.js
. webpack の自動読み込みを複製せずに、アプリの別のセクション用に vue コンポーネントの個別のバンドルを作成するにはどうすればよいですか?
laravel - laravel mixファイルへのデータテーブルの追加
このドキュメントdatatables
の助けを借りて npmをインストールしましたが、データテーブル cssおよびjs ファイルを自分のファイルに追加する方法がわかりません。app.css
app.js
NPM によってダウンロードされたファイル
コード
私のwebpack.mix.js
何か案が?
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) これにアプローチするより良い方法があれば、それについて聞きたいからです.