fujjima’s blog

主に備忘録

webpackについて(備忘録)

htmlのheadにてlodashをcdn経由で使用するためのリンクを貼っつける
bodyでindex.jsスクリプトを使用するための記述を追加する

index.js内では、htmlのbodyに追加するdivの中身を生成して追加する
webpackを使うと、index.htmlで必要とされるデータ(画像、スクリプトなど)を、個々でサーバーに取得要求しなければならず、
時間がかかってしまうことを解決できる。


npm installした「lodash」をローカルで使うように修正。
npm installした後、index.js内にimport文を書く。

src/index.jsを、webpacjkがバンドルして、その成果物「main.js」をdist/に出力する。
なので、index.html側でmain.jsを使用できるように、body内で
main.jsを読み込んでいる。

  • webpack.config.jsについて

config.jsをwebpackに使ってもらうには、exportしないといけない



npxコマンドについて
ローカルにインストールしたnpmパッケージを、「npx」と入力することで実行可能。
npxはnpmにバンドルされているため、個別のインストールは不要。

ひとまず、下記コマンドで対応した。

# 開発環境
npm run dev

# 本番環境
npm run build