Rails6 開発時につまづきそうな webpacker, yarn 関係のエラーと解決方法
はじめに
Rails6でwebpackerが標準になったことにより、Railsアプリの開発環境にyarnのインストールが必要になりました。
webpacker,yarnがインストールされてない環境で発生するエラーと解決方法について備忘録として投稿させていただきます。
開発環境
Rails 6.0.0.rc2
Ubuntu Server 18.04 LTS
もくじ
- webpacker がインストールされてない
- yarn がインストールされてない
- node_modules がインストールされてない
- パッケージのバージョンが不一致(？)
⚠️ webpacker がインストールされてない
rails6のアプリを新規作成したときに発生します。
エラー
rails s などの時点で webpacker がインストールされてない場合、
$ rails s
=> Booting Puma
=> Rails 6.0.0.rc2 application starting in development
=> Run `rails server --help` for more startup options
RAILS_ENV=development environment is not defined in config/webpacker.yml, falling back to production environment
Exiting
...
/home/ubuntu/.rvm/gems/ruby-2.6.3/gems/webpacker-4.0.7/lib/webpacker/configuration.rb:91:in `rescue in load': Webpacker configuration file not found /home/ubuntu/environment/test-app1/config/webpacker.yml.
Please run rails webpacker:install Error: No such file or directory @ rb_sysopen - /home/ubuntu/environment/test-app1/config/webpacker.yml (RuntimeError)
補足
bundle install時点でwebpackerがインストールできないとログ上に警告が出ます
$ bundle install
...
run bundle exec spring binstub --all
* bin/rake: Spring inserted
* bin/rails: Spring inserted
rails :install
Yarn not installed.
Please download and install Yarn from https://yarnpkg.com/lang/en/docs/install/
https://yarnpkg.com/ja/docs/install
解決方法
webpackerをインストールする
$ rails webpacker:install
...
Done in 7.00s.
Webpacker successfully installed 🎉 🍰
yarnがインストールされてない場合は、以下のようなエラーが表示されるので、yarn がインストールされてないの解決方法を実施したあとで再度rails webpacker:installを実行してください。
$ rails webpacker:install
Yarn not installed.
Please download and install Yarn from https://yarnpkg.com/lang/en/docs/install/
⚠️ yarn がインストールされてない
yarn がインストールされてない環境でrails6アプリの開発を始める時に発生します。
エラー
webpackerのインストール時点で yarn がインストールされてない場合、
$ rails webpacker:install
Yarn not installed.
Please download and install Yarn from https://yarnpkg.com/lang/en/docs/install/
rails s などの時点で yarn がインストールされてない場合、
$ rails s # または、rails db:migrate など
=> Booting Puma
=> Rails 6.0.0.rc2 application starting in development
=> Run `rails server --help` for more startup options
sh: 1: yarn: not found
# sh: yarn: command not found と表示されるケースもある
========================================
Your Yarn packages are out of date!
Please run `yarn install --check-files` to update.
========================================
To disable this check, please change `check_yarn_integrity`
to `false` in your webpacker config file (config/webpacker.yml).
解決方法
yarn をインストールする
yarn がインストールされているか確認
$ yarn -v
Command 'yarn' not found, but can be installed with:
sudo apt install cmdtest
yarn をインストールする
# mac
$ brew install yarn
# ubuntu
$ curl -sS https://dl.yarnpkg.com/debian/pubkey.gpg | sudo apt-key add -
$ echo "deb https://dl.yarnpkg.com/debian/ stable main" | sudo tee /etc/apt/sources.list.d/yarn.list
$ sudo apt-get update && sudo apt-get install yarn
# など
補足：OS毎のインストール方法はyarnの公式ドキュメントに掲載されてます
yarn がインストールされたことを確認
$ yarn -v
1.17.3
yarn installを実行して、package.json にリスト化されている全ての依存関係を node_modules 内にインストールする。
$ yarn install
yarn install v1.17.3
info No lockfile found.
[1/4] Resolving packages...
[2/4] Fetching packages...
[3/4] Linking dependencies...
[4/4] Building fresh packages...
success Saved lockfile.
Done in 3.36s.
⚠️ node_modules がインストールされてない
yarnがインストールされている環境でrails6のプロジェクトをgit cloneした後などに発生します。
エラー
rails s などの時点で node_modules がインストールされてない場合、
$ rails s # または、rails db:migrate など
error Couldn't find an integrity file
error Found 1 errors.
========================================
Your Yarn packages are out of date!
Please run `yarn install --check-files` to update.
========================================
To disable this check, please change `check_yarn_integrity`
to `false` in your webpacker config file (config/webpacker.yml).
解決方法
yarn installを実行して、package.json にリスト化されている全ての依存関係を node_modules 内にインストールする。
$ yarn install
yarn install v1.17.3
info No lockfile found.
[1/4] Resolving packages...
[2/4] Fetching packages...
[3/4] Linking dependencies...
[4/4] Building fresh packages...
success Saved lockfile.
Done in 3.36s.
⚠️ パッケージのバージョンが不一致(？)
rails new して作成した Rails6アプリ を起動した際に発生しました。
エラー
$ yarn install
...
# ----------
$ rails s
...
========================================
Your Yarn packages are out of date!
Please run `yarn install --check-files` to update.
========================================
To disable this check, please change `check_yarn_integrity`
to `false` in your webpacker config file (config/webpacker.yml).
yarn check v1.6.0
success Folder in sync.
Done in 0.10s.
yarn check v1.6.0
error "webpack-dev-server#yargs#cliui" is wrong version: expected "^4.0.0", got "5.0.0"
error "webpack-dev-server#yargs#yargs-parser" is wrong version: expected "^11.1.1", got "13.1.1"
error Found 2 errors.
info Visit https://yarnpkg.com/en/docs/cli/check for documentation about this command.
メッセージに表示されているコマンドを実行しても解決しなかった。
$ yarn install --check-files
# => 解決しなかった
$ yarn install
# => 解決しなかった
$ yarn upgrade
# => 解決しなかった
解決方法
yarn を アップグレードした後に yarn upgradeを実行したら解決した。
# yarn の アップグレード
# mac の場合
$ brew upgrade yarn
==> Upgrading 1 outdated package:
yarn 1.6.0 -> 1.17.3
==> Upgrading yarn
...
# ----------
$ yarn upgrade
yarn upgrade v1.17.3
[1/4] 🔍 Resolving packages...
warning @rails/webpacker > postcss-preset-env > postcss-color-functional-notation > postcss-values-parser > [email protected]: I wrote this module a very long time ago; you should use something else.
[2/4] 🚚 Fetching packages...
[3/4] 🔗 Linking dependencies...
warning " > [email protected]" has unmet peer dependency "webpack@^4.0.0".
warning "webpack-dev-server > [email protected]" has unmet peer dependency "webpack@^4.0.0".
[4/4] 🔨 Rebuilding all packages...
success Saved lockfile.
success Saved 673 new dependencies.
info Direct dependencies
...
✨ Done in 42.59s.
# ----------
$ rails s
# => エラーが発生しなくなった
💡 おまけ
gem install rails で rails6 がインストールされない
gem install rails で rails6 がインストールされない正式リリースまでは以下のコマンドでインストールする
# gem install rails でインストールされるバージョンを確認
$ gem search -r ^rails$
*** REMOTE GEMS ***
rails (5.2.3)
# ----------
# 上記コマンド実行時に 6.x が表示されない場合は以下のコマンドでインストール
$ gem install rails --prerelease
# 上記コマンド実行時に 6.x が表示された場合は以下のコマンドでOK
$ gem install rails
# ----------
# インストールされたバージョンを確認
$ rails -v
Rails 6.0.0.rc2
Author And Source
この問題について(Rails6 開発時につまづきそうな webpacker, yarn 関係のエラーと解決方法), 我々は、より多くの情報をここで見つけました https://qiita.com/NaokiIshimura/items/8203f74f8dfd5f6b87a0著者帰属：元の著者の情報は、元のURLに含まれています。著作権は原作者に属する。
Content is automatically searched and collected through network algorithms . If there is a violation . Please contact us . We will adjust (correct author information ,or delete content ) as soon as possible .