需要使用Browserify和browserify-rails的sprockets预处理文件 [英] Requiring a sprockets-preprocessed file with Browserify and browserify-rails
问题描述
我正在使用 browserify-rails 而我正在尝试将链轮转到预处理包含sprockets指令的文件,这样当我使用browserify require()
时,它将包含生成的JavaScript。
I'm using browserify-rails and I'm trying to get sprockets to preprocess a file that contains a sprockets directive, so that when I require()
it using browserify, it will contain the generated JavaScript.
sprockets指令尝试包含gem js-routes 的输出,为了允许我从客户端访问Rails路由。
The sprockets directive tries to include the output of the gem js-routes, in order to allow me to access the Rails routes from the clientside.
这是我的设置(在 app / assets / javascripts
):
system/
rails_routes.js
application.js
application.js
是主文件,它运行应用程序的其余部分。我希望能够做类似的事情
application.js
is the main file, and it runs the rest of the application. I would like to be able to do something like
var rr = require("./system/rails_routes.js");
,并且可以访问路线对象。
in it, and get access to the routes object.
在 system / react_routes.js
中,我有以下内容:
//= require js-routes
console.log("Does this work?");
(另外,我配置 js-routes
将输出放在名为 module.exports
的对象中,以符合CommonJS模型,如 railsware / js-routes#121 )
(as an aside, I configured js-routes
to place the output in an object called module.exports
, so to comply with the CommonJS model, as described in railsware/js-routes#121)
唯一的问题是我查看生成的bundle,sprockets指令仍在那里并且尚未扩展。
The only issue is that when I look at the generated bundle, the sprockets directive is still there and has not been expanded.
console.log
当我 require()
模块时,调用也在那里并被执行。
The console.log
call is also there and gets executed when I require()
the module.
有没有办法获得这个工作?在使用browserify-rails捆绑文件之前让链接器预处理文件的正确方法是什么?
Is there a way to get this to work? What is the correct way to have sprockets preprocess a file before bundling it with browserify-rails?
推荐答案
我花了无数个小时在我的项目中集成browserify-rails并使JS Routes在此设置中工作...
I’ve spent endless hours on integrating browserify-rails in my project and making JS Routes work within this setup…
我来到下面描述的解决方案是我无法拥有的解决方案在Browserify进来之前,Sprockets会预处理我的路径文件。我在browserify-rails和sprockets的源代码中花了很长时间但却无法找到解决问题的方法并让每个组件以正确的顺序运行为了这个工作。
The solution I came to and described below is the result of me not being able to have Sprockets pre-process my routes file before Browserify would come in. I have spent quite some time in both the source code of browserify-rails and sprockets but couldn't find a way to turn things around and have each component act in the correct order for this to work.
所以我的解决方案是使用Rails钩子在开发环境中手动生成完整的JS文件,以便路由始终处于运行状态与最新的Rails路由文件。然后我假设路由JS文件在推送到生产时将是最新的。
So my solution was to use a Rails hook to generate the complete JS file « by hand » in the development environment, so that routes are always up to date with the latest Rails routes files. I then assume the routes JS file will be up to date when pushing to production.
在环境加载中这样做可确保在Sprockets / browserify chime之前JS文件已准备就绪in:对于他们来说,这只是另一个普通的JS文件。
Doing so in the environment loading makes sure the JS file is ready before Sprockets/browserify chime in: for them it’s just another plain JS file.
这是包含在 development.rb
中的代码:
ActionDispatch::Reloader.to_prepare do
Rails.application.reload_routes!
if JsRoutes.assert_usable_configuration!
JsRoutes.generate!(Rails.root.join('app/assets/javascripts/routes.js'))
end
end
您需要始终重新加载路由,否则生成的文件将始终表示Rails路由文件的倒数第二个状态。我从来没有弄明白为什么...
You'll want to always reload routes, otherwise the generated file will always represent the second to last state of the Rails routes file. I never figured out why...
在我的 application.js
中,我刚刚删除了所有 // =
指令但是jQuery指令(保持全局jQuery可用),并对所有其他模块使用 require
方法浏览器会选择我想要包含的文件。
In my application.js
, I then just removed all //=
directives but the jQuery ones (to keep a global jQuery available), and used the require
method for all other modules so that browserify would pick the files I want to include.
所以这有点hacky,但确实有效。
So this is a bit hacky, but it does work.
我有兴趣看看对Sprockets管道有更好了解的人是否可以提供更好的解决方案?
I'd be interested to see whether someone with better knowledge of the Sprockets pipeline could come with a better solution?
这篇关于需要使用Browserify和browserify-rails的sprockets预处理文件的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!