📌  相关文章
📜  Webpacker 找不到 (1)

📅  最后修改于: 2023-12-03 15:21:07.910000             🧑  作者: Mango

Webpacker 找不到

当你在使用 Webpacker 时,有时会遇到 "找不到" 的错误提示。这种错误通常是因为缺少了必要的文件或配置信息,或者是文件路径错误等原因。

以下是一些可能导致 Webpacker 找不到的问题以及解决方案:

1. 找不到图片文件

如果你的应用程序需要使用图片,在使用 Webpacker 时,你需要将图片文件放在正确的位置。通常情况下,你需要放置在 app/javascript/images 目录下。

同时,你还需要在 app/javascript/packs/application.js 中添加以下代码:

require.context('../images', true)

这个代码片段会将 ../images 目录中的所有图片文件打包到 application.js 文件中。

2. 找不到 JavaScript 或 CSS 文件

当你在使用 Webpacker 时,你需要将你的 JavaScript 和 CSS 文件放在 app/javascript/packs 目录下。如果你的应用程序包含多个 JavaScript 文件,你需要使用 importrequire 指令将它们导入到 application.js 文件中。

如果你的应用程序使用了 CSS 文件,则需要将 CSS 文件放置在 app/javascript/stylesheets 目录下,并在 application.js 中导入它们:

import '../stylesheets/application'
3. 找不到 Webpacker 配置文件

当运行 Webpack 命令时,Webpack 默认会查找 webpack.config.js 文件。如果你在使用 Webpacker 时,需要添加自定义配置信息,你需要在 config/webpack 目录下创建一个 custom.jscustom-environment.js 文件。

在这些文件中,你可以添加你需要的配置信息,例如:

module.exports = {
  module: {
    rules: [
      {
        test: /\.(woff2?|ttf|eot|svg)$/,
        use: [
          {
            loader: 'url-loader',
            options: {
              limit: 8192,
              fallback: {
                loader: 'file-loader',
                options: {
                  name: '[name].[ext]'
                }
              }
            }
          }
        ]
      }
    ]
  }
};
4. 找不到 Webpacker 环境变量

当你在使用 Webpacker 时,你可以设置环境变量来控制打包的方式。如果你在打包时出现了找不到环境变量的错误,你需要在 config/webpacker.yml 文件中添加相应的配置信息。

例如,如果你想使用自定义的构建路径,你可以在 config/webpacker.yml 中添加以下配置信息:

build:
  public_output_path: "/custom/path"

以上是一些常见的 Webpacker 找不到问题及解决方案。如果你还遇到了其他问题,请参考官方文档或查找相关的解决方案。