LoginSignup
3
2

More than 5 years have passed since last update.

Webpackでソースコードを変更していないのにビルド結果に差分が発生する場合の対処

Posted at

Webpackのビルド結果をGit管理に含めている場合に、自分はソースコードを変更していないのにビルド結果に差分が発生する問題に遭遇しました。

謎の__webpack_require__の差分が発生

/******/    function __webpack_require__(335) { (-) ビルド前
/******/    function __webpack_require__(363) { (+) ビルド後

例えばこんな感じで__webpack_require__の数字の部分だけ変わっています。

webpack 基本的な使い方AICS | AICS http://aics-app.sakura.ne.jp/blog/2014/09/03/webpack-%E5%9F%BA%E6%9C%AC%E7%9A%84%E3%81%AA%E4%BD%BF%E3%81%84%E6%96%B9/

調べてみると、この数字はwebpack内で読み込んだモジュールに順番でつけられる番号であることがわかりました。

開発者間のnode_modulesの差分が原因

プロジェクト配下に配置しているnode_modulesの中身が開発者毎に異なっていたのが原因でした。

npm installをするとpackage.jsonを元に必要なnpmがインストールされますが、
開発時に試しに使いたいnpmを--saveや--save-devをつけずにnpm installしている人が
チーム内にいるとこの問題が発生します(自分がやらかしたので自戒)

試しに使うnpmは-gで各自のPCにインストールする

なので、開発時に試しに使ってみたいと思ったnpmがあったら
npm install -gで自分のPCにインストールしましょう。

そうすればプロジェクトの他の開発者に迷惑はかかりません。
今後も忘れた頃に同じ問題に遭遇しそうなので、メモしておきました。気をつけよう。

3
2
1

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
3
2