railsのserver起動時エラー『 Webpacker configuration file not found』対処



本稿では、表題の
『Webpacker configuration file not found』
エラーが発生してサーバーが起動できない時の対処方法について、実際に行った手順を共有します。[^1]

#(実行環境について)

<details><summary>当時の環境について(ここをクリック)</summary>
<div> 

```
(Windowsの情報)
Microsoft Windows [Version 10.0.18363.1110]
(c) 2019 Microsoft Corporation. All rights reserved.

(Nodeのバージョン)
C:\WINDOWS\system32>node -v
v14.12.0

※Nodeがインストールされていない場合は次のコマンドを実行します。
brew install node


(rubyのバージョン)
C:\WINDOWS\system32>ruby -v
ruby 2.6.6p146 (2020-03-31 revision 67876) [x64-mingw32]
```

```
(参考：)
(railsのインストールの様子です。)

C:\WINDOWS\system32>gem install rails
Fetching tzinfo-1.2.7.gem
Fetching thread_safe-0.3.6.gem
・・・
(中略)
・・・
driver, actioncable, mimemagic, marcel, activestorage, actionmailbox, actiontext, thor, 
method_source, railties, sprockets, sprockets-rails, rails after 88 seconds
40 gems installed

C:\WINDOWS\system32>rails -v
Rails 6.0.3.3
```

```
(railsプロジェクトの作成。　プロジェクト名：kita_rb)

C:\WINDOWS\system32>cd \xampp\htdocs　　(作成ディレクトリに移動)

C:\xampp\htdocs>rails new kita_rb -G
      create
      create  README.md
      create  Rakefile
      create  .ruby-version
      create  config.ru
      create  Gemfile
・・・
(中略)
・・・      
Installing webdrivers 4.4.1
Fetching webpacker 4.3.0
Installing webpacker 4.3.0
Bundle complete! 14 Gemfile dependencies, 70 gems now installed.
Use `bundle info [gemname]` to see where a bundled gem is installed.
         run  bundle binstubs bundler
       rails  webpacker:install
Yarn not installed. Please download and install Yarn from https://yarnpkg.com/lang/en/docs/install/　(←エラーが出ている！！)

C:\xampp\htdocs>cd kita_rb　　　(プロジェクトディレクトリに移動しておく)
```

</div> 
</detail>

<br>
#１．サーバーの起動（エラー発生時）

```
C:\xampp\htdocs\kita_rb>rails s
=> Booting Puma
=> Rails 6.0.3.3 application starting in development
=> Run `rails server --help` for more startup options
Exiting
Traceback (most recent call last):
        49: from bin/rails:4:in `<main>'
        48: from bin/rails:4:in `require'

・・・
(中略)
・・・

         2: from C:/Ruby26-x64/lib/ruby/gems/2.6.0/gems/webpacker-4.3.0/lib/webpacker/configuration.rb:88:in `data'
         1: from C:/Ruby26-x64/lib/ruby/gems/2.6.0/gems/webpacker-4.3.0/lib/webpacker/configuration.rb:91:in `load'
C:/Ruby26-x64/lib/ruby/gems/2.6.0/gems/webpacker-4.3.0/lib/webpacker/configuration.rb:95:in `rescue in load': Webpacker configuration file not found C:/xampp/htdocs/kita_rb/config/webpacker.yml. Please run rails webpacker:install Error: No such file or directory @ rb_sysopen - C:/xampp/htdocs/kita_rb/config/webpacker.yml (RuntimeError)

↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑
(エラー発生！！)
```

本稿では、この
『Webpacker configuration file not found』
エラーが発生してサーバーが起動できない時の対処方法について、解決のため実際に行った手順を共有しようと思います。[^1]
<br>
エラーメッセージ中に
『Please run rails webpacker:install』（webpackerをインストールしなさい）
とありましたのでこれを実行します。
<br>


#２．webpackerのインストール

プロジェクトのルートにあるGemfileの中に
gem 'webpacker', '~> 4.0'
の記述があることを確認します。[参照][link] 

```cmd:Gemfile
gem 'webpacker', '~> 4.0'
```


bundle installを実行します。

```
C:\xampp\htdocs\kita_rb>rails webpacker:install
Yarn not installed. Please download and install Yarn from https://yarnpkg.com/lang/en/docs/install/
```

『Yarnがインストールされていない』ということですので
インストールします。

#３．Yarnをインストール

```
C:\xampp\htdocs\kita_rb>npm install -g yarn
C:\Users\tatsu\AppData\Roaming\npm\yarn -> C:\Users\tatsu\AppData\Roaming\npm\node_modules\yarn\bin\yarn.js
C:\Users\tatsu\AppData\Roaming\npm\yarnpkg -> C:\Users\tatsu\AppData\Roaming\npm\node_modules\yarn\bin\yarn.js
+ yarn@1.22.5
added 1 package in 0.786s
```
<br>
再度、bundle installを実行します。

```
C:\xampp\htdocs\kita_rb>bundle install
Using rake 13.0.1
Using concurrent-ruby 1.1.7
Using i18n 1.8.5
Using minitest 5.14.2
Using thread_safe 0.3.6
Using tzinfo 1.2.7
Using zeitwerk 2.4.0
・・・
(中略)
・・・
Using turbolinks 5.2.1
Using tzinfo-data 1.2020.1
Using web-console 4.0.4
Using webdrivers 4.4.1
Using webpacker 4.3.0
Bundle complete! 14 Gemfile dependencies, 70 gems now installed.
Use `bundle info [gemname]` to see where a bundled gem is installed.
```


<br>
ここでやっとwebpackerのインストールができそうです。

```
C:\xampp\htdocs\kita_rb>rails webpacker:install
      create  config/webpacker.yml
Copying webpack core config
      create  config/webpack
      create  config/webpack/development.js
・・・
(中略)
・・・      
├─ webpack-dev-middleware@3.7.2
├─ webpack-dev-server@3.11.0
└─ ws@6.2.1
Done in 9.80s.
Webpacker successfully installed 🎉 🍰
```


<br>
再度、サーバーを起動します。

```
C:\xampp\htdocs\kita_rb>rails s
=> Booting Puma
=> Rails 6.0.3.3 application starting in development
=> Run `rails server --help` for more startup options
*** SIGUSR2 not implemented, signal based restart unavailable!
*** SIGUSR1 not implemented, signal based restart unavailable!
*** SIGHUP not implemented, signal based logs reopening unavailable!
Puma starting in single mode...
* Version 4.3.6 (ruby 2.6.6-p146), codename: Mysterious Traveller
* Min threads: 5, max threads: 5
* Environment: development
* Listening on tcp://[::1]:3000
* Listening on tcp://127.0.0.1:3000
Use Ctrl-C to stop
Started GET "/" for ::1 at 2020-09-26 16:23:01 +0900
   (10.1ms)  SELECT sqlite_version(*)
Processing by Rails::WelcomeController#index as HTML
  Rendering C:/Ruby26-x64/lib/ruby/gems/2.6.0/gems/railties-6.0.3.3/lib/rails/templates/rails/welcome/index.html.erb
  Rendered C:/Ruby26-x64/lib/ruby/gems/2.6.0/gems/railties-6.0.3.3/lib/rails/templates/rails/welcome/index.html.erb (Duration: 5.9ms | Allocations: 416)
Completed 200 OK in 24ms (Views: 13.1ms | ActiveRecord: 0.0ms | Allocations: 2331)
```

<br>
http://localhost:3000 をブラウザで開いて確認します。![localhost3000.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/267448/7bdad101-97e7-8ffd-1919-1b9ea2e010e3.jpeg)


起動成功しました！！
<br>

以上、よろしければ参考になさってください。
<br>
[^1]: 同エラーの解決策としてはすでに他にいくつかのサイトがその方法を紹介しています。私の場合それらを試したときになぜかいろいろエラーが発生し、その都度解決策を探す必要がありました。その経験を踏まえ結果「こうすればよかったんじゃないか」という手順をまとめました。<br><b>参照させていただいたサイト：</b>「rails serverでサーバーを起動しようとしたら、Webpacker configuration file not foundエラーが発生した時の対処方法」[参照][link] 
[link]:https://qiita.com/yokota02210301/items/46f44af5787a1a492bd4