【问题标题】:Is there a way to use polymer-dart with Ruby on rails?有没有办法将聚合物飞镖与 Ruby on rails 一起使用?
【发布时间】:2016-04-13 04:01:42
【问题描述】:

目前在轨道或其他框架作品上使用带有红宝石的聚合物飞镖最简单的方法是什么?

使用 vulcanize 和 polymer-rails gem 以及一些技巧,我正在尝试处理 html 导入。
但我很难解析文件网址。

获取http://localhost:3000/assets/paper_ripple_behavior.dart

似乎有些聚合物脚本试图使用相对于自身位置的 url 或期望 dart 服务器来获取 dart 脚本。由于它经过硫化和处理,并且在 RoR 上,它永远不会找到它想要的东西(也许我应该克隆包并重写所有链接,更容易)。
或者,如果没有重复的名称,我可以在 localhost:3000/assets/
上提供所有文件 一些功能似乎也在做如下的事情:

Exception: Uncaught Error: Unable to find library at http://localhost:3000/assets/shadow.dart.
Stack Trace:
#0      InitializationCrawler.InitializationCrawler (package:initialize/src/mirror_loader.dart:43:31)
#1      loadInitializers (package:initialize/src/mirror_loader.dart:16:14)
#2      run (package:initialize/initialize.dart:27:24)
#3      run.<run_async_body> (package:web_components/src/mirror_initializer.dart:26:11)
#4      Future.Future.microtask.<anonymous closure> (dart:async/future.dart:144)
#5      _microtaskLoop (dart:async/schedule_microtask.dart:43)
#6      _microtaskLoopEntry (dart:async/schedule_microtask.dart:52)
#7      _ScheduleImmediateHelper._handleMutation (dart:html:42567)
undefined:1 undefined

此时,我正在考虑在不同的端口上运行 RoR 和 dart 并将一些请求重定向到 dart 服务器,但我不知道它是否实用。

你会让飞镖和 RoR 一起玩吗?

编辑

经过几天的修修补补,我得出的结论是,Günter Zöchbauer 暂时可能是正确的。

  1. 在 packages 目录下的 html 文件中重写嵌入的 html 导入 href
  2. 修改 html 导入 url(在文件“web_components-0.12.0+4/lib/html_import_annotation.dart”的初始化方法中找到的 element.href 正在处理这个问题)

似乎解决了一些 html 导入 url 的问题,嵌入式脚本仍在尝试直接在 assets 下加载 dart 文件:“http://localhost:3000/assets/paper_button.dart”。 “initPolymer()”也尝试以类似的方式加载依赖文件,至少在“/components/packages/initialize/src/mirror_loader.dart”中。
这些与其他 dart 库的行为不一致,因此希望在未来的版本中会有所改变。
就目前的情况而言,了解和找到加载器脚本对我来说太难了,尽管我相信更熟练的程序员会发现它轻而易举。

【问题讨论】:

  • 这是 Polymer 1.0.0-rc.x 还是 0.16.x?
  • Polymer 1.0.0-rc.x 中的(非 dart 源)资源文件存在已知问题,其中路径解析错误。
  • 您好 Günter Zöchbauer。我使用的是聚合物:^1.0.0-rc.6。作为问题的答案,您的“仅作为静态资产”似乎是正确的,这几乎是“不,您不能”,因为用例违背了 rails 的目的。你介意我继续提问吗?
  • 我不了解 Rails,但如果您稍微解释一下,我可能会提供一个有用的答案。这如何违背 Rails 的目的? Polymer.dart 应用程序不支持在 pub build 之后修改,pub build 是创建可部署的唯一方法。构建后唯一可以修改的是非内联 CSS。即使将单个文件写入构建输出目录,元素模板 HTML 也都是内联的 AFAIK - 这只是 pub 的当前限制。
  • 没什么复杂的。对于提供静态文件,RoR 是……嗯,不理想。至于“pub build 是创建可部署的唯一方法”,我们有 dart2js 和 html、dart、css 是不同的资产,理论上可以动态修改非组件 html 文档。嗯,我刚刚有了一个想法,我可以发布构建,然后将入口点 html 文件编辑到 erb 模板中并将其移动到我的视图文件夹中……我为什么没有想到这一点?

标签: ruby-on-rails dart dart-polymer


【解决方案1】:

对于部署,您需要在 Dart 包中运行 pub build 并从您的服务器提供结果 (build/web)。你不能提供 Dart 源。 如果您使用https://pub.dartlang.org/packages/dart_to_js_script_rewriter,则不应获取任何*.dart 文件。

对于开发,使用将 Dart 资源请求重定向到 pub serve 的服务器。

【讨论】:

    【解决方案2】:

    是的,我找到了办法。

    目的

    使用 dart-polymer 标签并在 Rails 服务器上运行用 dart 编写的应用程序。

    方法

    通过在 RailsAppRoot/pub 上提供必要的资源并编辑 views/layout/application.html.erb

    怎么做

    1. 在 webstorm 或 intellij 上创建一个简单的应用程序,使用您希望在 Rails 应用程序中使用的聚合物标签。
    2. 修改应用中的链接以获取相对于 url 根目录的资源。
    3. 将 web 文件夹 dart_app_project_name/build/web 的内容复制到 rails_app_root/pub
    4. 您可能还需要复制 lib 文件夹
    5. 将 dart 应用的入口点 html 文件中的标头和脚本复制到“application.html.erb”或使用部分渲染。
    6. 在任何地方使用聚合物标签。

    对于第 2 步,您可以使用如下内容:

    require 'pry'  
    require 'pry-doc'    
    require 'pry-byebug' 
    require 'nokogiri'
    def prepend_slash file 
      doc = Nokogiri::HTML(File.open(file).read())
      doc.search("link[rel='import']").each do |node|
        href = node['href']
        next if href.nil?
        node['href'] ="/"+ href if href[0] != "/"
      end
      doc.search("script").each do |n|
        src = n['src']
        next if src.nil?
        n['src'] = "/"+src if src[0] != "/"
      end
      File.open(file,'w').write doc.to_html
    end
    
    target = 'path_to_your_app/app/views/layouts/_polymer_body.html.erb'
    prepend_slash(target)
    p "processed"
    

    您的应用程序和 rails 服务器可以使用 json 或简单地通过在 html 文档中嵌入数据进行通信,因此理论上 dart-polymer 和 rails 现在可以一起玩。
    如果 Turbolinks 给您带来麻烦,请尝试以下操作:

    import 'dart:html';
    import 'dart:js' as js;
    void onReady(var callback){
        var d = js.context.callMethod(r'$',[document]);
        d.callMethod('on',['page:change']);
    }
    

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 2013-08-24
      • 1970-01-01
      • 2014-10-05
      • 1970-01-01
      • 1970-01-01
      • 2014-03-15
      • 2014-10-14
      • 1970-01-01
      相关资源
      最近更新 更多