解决Webpacker::Manifest::MissingEntryError错误的方法

2 年 ago
科, 雅
2 minutes

开发环境

 

错误信息

WebpackerError黒塗り.png
ActionView::Template::Error (Webpacker can't find application.js in C:/Users/○○/Desktop/○○/public/packs/manifest.json. Possible causes:
1. You want to set webpacker.yml value of compile to true for your environment
   unless you are using the `webpack -w` or the webpack-dev-server.
2. webpack has not yet re-run to reflect updates.
3. You have misconfigured Webpacker's config/webpacker.yml file.
4. Your webpack configuration is not creating a manifest.
Your manifest contains:
{
}
):
7:     <%= csp_meta_tag %>
8:
9:     <%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %>
10:    <%= javascript_pack_tag 'application', 'data-turbolinks-track': 'reload' %>
11:   </head>

预先准备

确认Node版本

这个方法在node的版本为16.x系列时有效。可以在命令提示符（或终端）中执行。

node -v

请运行命令并确认您自己的节点版本。如果您使用的是另一个版本, 请进行版本更改。

在Windows操作系统中使用。

Mac使用
⇒https://qiita.com/k3ntar0/items/322e668468716641aa5c

解决方案

Gemfile的更改

image.png
- gem 'webpacker', '~> 5.0'
+ gem 'webpacker', '5.4.3'

随后，在命令提示符窗口中。

bundle install

请做这件事。

更改 package.json 文件

在VSCode中的package.json文件的devDependencies部分中

    "@babel/plugin-proposal-private-methods": "^7.18.6",
    "@babel/plugin-proposal-private-property-in-object": "^7.21.0",
    "babel-loader": "^8.2.2",

请在 （这个地方/下面/文末等） 添加 注释。

希望能如此。

{
  "name": "○○",
  "private": true,
  "dependencies": {
    "@rails/actioncable": "^6.0.0",
    "@rails/activestorage": "^6.0.0",
    "@rails/ujs": "^6.0.0",
    "@rails/webpacker": "5.4.3",
    "turbolinks": "^5.2.0",
    "webpack": "4.46.0",
    "webpack-cli": "3.3.12"
  },
  "version": "0.1.0",
  "devDependencies": {
    "@babel/plugin-proposal-private-methods": "^7.18.6",
    "@babel/plugin-proposal-private-property-in-object": "^7.21.0",
    "babel-loader": "^8.2.2",
    "webpack-dev-server": "3"
  }
}

随后，

npm install

请执行。

Webpacker的安装

在命令提示符下

rails webpacker:install

请执行。

随后，

rails webpacker:compile

请执行一下这个操作。我认为这样可以解决Webpacker的错误。

错误备忘录

当执行 npm install 命令时出现 npm 警告的情况。

在命令提示符中输入npm install之后,

npm WARN config global `--global`, `--local` are deprecated. Use `--location=global` instead

有时候会出现警告消息。要解决此问题，需要更改nodejs的内容。如果您没有看到此消息，请继续进行下一步操作即可。

从资源管理器中查找nodejs，将其中的npm、npm.cmd、npx、npx.cmd文件移入VSCode进行编辑。
nodejs位于C:\Program Files\nodejs。

スクリーンショット 2023-07-04 095330.png

npm的第23行左右

- NPM_PREFIX=`"$NODE_EXE" "$NPM_CLI_JS" prefix -g`
+ NPM_PREFIX=`"$NODE_EXE" "$NPM_CLI_JS" prefix --location=global`

npm.cmd的第12行附近

- FOR /F "delims=" %%F IN ('CALL "%NODE_EXE%" "%NPM_CLI_JS%" prefix -g') DO (
+ FOR /F "delims=" %%F IN ('CALL "%NODE_EXE%" "%NPM_CLI_JS%" --location=global') DO (

npx32附近的位置

- NPM_PREFIX=`"$NODE_EXE" "$NPM_CLI_JS" prefix -g` 
+ NPM_PREFIX=`"$NODE_EXE" "$NPM_CLI_JS" prefix --location=global`

附近是在npx.cmd的第13行附近。

- FOR /F "delims=" %%F IN ('CALL "%NODE_EXE%" "%NPM_CLI_JS%" prefix -g') DO ( 
+ FOR /F "delims=" %%F IN ('CALL "%NODE_EXE%" "%NPM_CLI_JS%" --location=global') DO (

更改这四个项目后，只需再次运行npm install，我想之前的错误就会消失。

文献引用

 

bannerAds