web-dev-qa-db-ja.com

WebpackインストールBootstrap-popper.js.mapがありません

https://getbootstrap.com/docs/4.0/getting-started/webpack/ の指示に従い、npmでjqueryとpopper.jsもインストールしました。

それでもbundle.jsの出力を使用する場合、ブラウザーはpopper.js.mapのGETリクエストを送信し続け、すべてのアセットが参加する必要がありますbundle.jsの。

私は適切な答えをたくさん探しましたが、上記の指示の誤りを説明するものは存在しません。助けてください。

bootstrap-4webpack-2popper.js
10
yoni.str

Popper.jsファイルの最後に、次のようなコメントがあります。

//# sourceMappingURL=popper.js.map

それを削除することで問題が解決しました。

30
Hoodlum

Webpack 3で SourceMapDevToolPlugin を使用してPopper.jsのソースマップを除外できます。

const webpack = require('webpack')

module.exports = {
  // other configs
  plugins: [
    // other plugin configs
    new webpack.SourceMapDevToolPlugin({
      exclude: ['popper.js']
    })
  ]
}

これは、特にPopper.jsがnpm --save popper.js。これにより、Popper.jsのソースファイルを変更せずに依存関係パッケージを更新できます。

4
HarlemSquirrel

上記のようにコメントを削除してもうまくいきませんでした。したがって、実際にpopper.min.js.mapコード...

popper github page には、実際のpopper jsファイルへのリンクがあります： https://unpkg.com/popper.js/dist/umd/popper。 min.js

これを https://unpkg.com/popper.js/dist/umd/popper.min.js.map に変更すると、必要なものが手に入ります！

3
Paul

CSSマップは、開発者がコードのどこにあるかを見つけるためにブラウザー開発者ツールが使用する単なるファイルです。

心配する必要はありません。すべてがユーザーにとって正常に機能します。

0
Klooven

ファイルに次のコードを追加します：import { Popper } from 'popper.js' window.Popper = Popper

コメントを外す代わりに//# sourceMappingURL=popper.js.map（このnode_modules/...ファイルをリポジトリに入れたくないため）

0
desloovere_j

警告を消すには、.sourceMaps()をwebpack.mix.jsのjsファイルに追加します。

mix.js('resources/js/app.js', 'public/js').sourceMaps();

少なくともLaravel 5および6。

0
KFoobar