将webpacker与Rails引擎一起使用

提问者：小点点

将webpacker与Rails引擎一起使用

我正在学习使用Rails引擎使用webpacker的教程：

http://ben.vandgrift.com/posts/rails-engine-webpacker-1/

它基于此：

https://github.com/rails/webpacker/blob/5-x-stable/docs/engines.md

教程和github留档内容非常丰富，但我无法让我的宿主应用程序包含来自引擎的javascript。我已经从本地克隆了教程中的repo（马鞍包是引擎的repo，马鞍包-假人是宿主应用程序）：

https://github.com/bvandgrift/saddlebag

https://github.com/bvandgrift/saddlebag-dummy

我所做的唯一修改是更新mimemagic gem，因为该gem的指定版本已从gem源中提取。

-    mimemagic (0.3.5)
+    mimemagic (0.3.10)
+      nokogiri (~> 1)
+      rake

当我在主机应用程序目录中运行rails webpacker： compile时，它会生成以下内容：

Hash: 10b1522b0b9c4b8aca2d
Version: webpack 4.44.1
Time: 966ms
Built at: 05/03/2021 2:48:22 PM
                                        Asset       Size  Chunks                         Chunk Names
       js/application-cb05ac1ef9258bc6a611.js   52.7 KiB       0  [emitted] [immutable]  application
    js/application-cb05ac1ef9258bc6a611.js.br   11.3 KiB          [emitted]
    js/application-cb05ac1ef9258bc6a611.js.gz   12.8 KiB          [emitted]
   js/application-cb05ac1ef9258bc6a611.js.map    145 KiB       0  [emitted] [dev]        application
js/application-cb05ac1ef9258bc6a611.js.map.br   31.9 KiB          [emitted]
js/application-cb05ac1ef9258bc6a611.js.map.gz   36.7 KiB          [emitted]
                            manifest.json  364 bytes          [emitted]
                         manifest.json.br  127 bytes          [emitted]
                         manifest.json.gz  142 bytes          [emitted]
Entrypoint application = js/application-cb05ac1ef9258bc6a611.js js/application-cb05ac1ef9258bc6a611.js.map
[0] (webpack)/buildin/module.js 552 bytes {0} [built]
[1] ./app/javascript/packs/application.js 682 bytes {0} [built]
    + 2 hidden modules

以下是清单. json文件的内容：

{
  "application.js": "/packs/js/application-cb05ac1ef9258bc6a611.js",
  "application.js.map": "/packs/js/application-cb05ac1ef9258bc6a611.js.map",
  "entrypoints": {
    "application": {
      "js": [
        "/packs/js/application-cb05ac1ef9258bc6a611.js"
      ],
      "js.map": [
        "/packs/js/application-cb05ac1ef9258bc6a611.js.map"
      ]
    }
  }
}

它看起来像webpacker正在运行，但不包括来自引擎的javascript。

尝试点击计数器页面，我得到以下内容：

webpacker找不到计数器. js

除非您使用webpack-w或webpack-dev-server，否则您希望为您的环境将compile的webpacker. yml值设置为true。
webpack尚未重新运行以反映更新。
您错误配置了Webpacker的config/webpacker. yml文件。
您的webpack配置没有创建清单。您的清单包含: { }

好的，这是正确的，我在引擎中的清单文件是空的。所以我想我需要在引擎中编译/webpack/process javascript。现在尝试编译引擎代码。引擎有一个rake task马鞍包：webpacker： compile在lib/task/saddlebag_tasks.rake中定义，但我无法运行它：

❯❯❯ rake saddlebag:webpacker:compile
rake aborted!
Don't know how to build task 'saddlebag:webpacker:compile' (See the list of available tasks with `rake --tasks`)

rake任务根本没有出现在rake--task中：

❯❯❯ rake --tasks
rake build            # Build saddlebag-0.1.0.gem into the pkg directory
rake clean            # Remove any temporary products
rake clobber          # Remove any generated files
rake clobber_rdoc     # Remove RDoc HTML files
rake install          # Build and install saddlebag-0.1.0.gem into system gems
rake install:local    # Build and install saddlebag-0.1.0.gem into system gems without network access
rake rdoc             # Build RDoc HTML files
rake release[remote]  # Create tag v0.1.0 and build and push saddlebag-0.1.0.gem to rubygems.org
rake rerdoc           # Rebuild RDoc HTML files
rake stats            # Report code statistics (KLOCs, etc) from the application or engine

所以我的问题是：如何在引擎中编译javascript以在宿主应用程序中使用？

共1个答案

匿名用户

我遇到了类似的问题。您需要在引擎上运行另一个webpack实例。

在开发bin/webpack-dev-server上（如果不存在则添加它）。

请注意，在部署时，您也需要在引擎上运行webpack，就像捆绑它一样。这是我在Capistrano 3中使用的工作示例。

  set : your_engine_path, 'some/path/to/your_engine'

  task :install_engine do
    on roles(:app) do
      with rails_env: fetch(:rails_env) do
        within "#{release_path}/#{fetch(:your_engine_path)}" do
          execute :bundle, 'install --path vendor/bundle'
        end
      end
    end
  end

  namespace :webpacker do
    desc 'Install deps with yarn'
    task :yarn_install do
      on roles(:app) do
        within "#{release_path}/#{fetch(: your_engine_path)}" do
          execute 'yarn'
        end
      end
    end

    desc 'Compile JavaScript packs using webpack for production with digests'
    task :compile do
      on roles(:app), in: :sequence, wait: 5 do
        within release_path do
          with rails_env: fetch(:rails_env) do
            execute :bundle, 'exec rake your_engine:compile_assets'
          end
        end
      end
    end
    before :compile, :yarn_install
  end