webpacker：包括来自gem的javascript（js-routes）

Question

我尝试将JS routes gem与来自Rails 5.1的webpacker一起使用，但无法弄清楚如何将js-routes.js.erb包含在webpack＆＃39; s { {1}}。

app/javascript/packs/application.js

导致

import 'js-routes'

这可能意味着webpack无法在包含的gem中找到javascript。这可能与此webpacker's github issue相关联。

目前这个问题的最佳解决方法是什么？

谢谢！

Answer 1

使用JsRoutes文档的very advanced setup部分中描述的技术：

// app/javascript/routes.js.erb

<%= JsRoutes.generate %>
export default this.Routes

然后在您的应用程序包中：

// app/javascript/packs/application.js

import Routes from '../routes.js.erb'
// Note the .erb extension!

// If you want it to be available globally for some reason:
window.Routes = Routes

Answer 2

如果你想要更多js only dev进程，你可以

1. 预生成的app/assets/javascripts/routes.js内置任务 rake js:routes

2. 添加到

   # config/webpacker.yml 
   ...
   resolved_paths: ['app/assets/javascripts']
   ...
   

3. 将其引用为import routes from './routes.js'

4. 使用rake js:routes
更改路由后重新生成它

Answer 3

如果您使用的是webpacker，则可能要签出js_from_routes，因为它是基于import的设置，因此它不需要高级设置。 >

对于您要从JS访问的每个端点，它将generate a method为您build a URL提供帮助或提出请求。

resources :video_clips, export: true

通过将in combination与axios一起使用，这些生成的帮助程序可以方便，易于使用：

import VideoClipsRequests from '@requests/VideoClipsRequests'

VideoClipsRequests.update({ data: video })
  .then(onVideoUpdate)

请记住，您可以通过提供自定义模板来调整生成的代码。

好处：

• 轻松指定应该生成帮助程序的路由。
• 无需手动指定URL，从而避免错误并节省开发时间。
• 与摇摇晃晃的游戏效果很好，未使用的帮助程序不包括在已编译的捆绑软件中。