2015-01-07 3 views
0

Ruby on Rails 4.2.0으로 symfony 애플리케이션을 이식하고 있습니다. 내 설정은 symfony에서 잘 작동합니다. RoR과 함께 dojo를 사용하는 방법에 대해서는 this old post이 있지만 사용되지 않는 코드가 사용됩니다. 내 application.html.erb에서Dojo에서 Ruby on Rails 4 작동시키기

나는

<script>dojoConfig = {async: true}</script> 
<%= javascript_include_tag 'http://ajax.googleapis.com/ajax/libs/dojo/1.10.3/dojo/dojo.js'%> 

내가 레일 사람과 심포니 래퍼를 교체해야합니다. Dojo 버전도 변경했습니다. 나는 1.9.1을 사용하고 있었다. 레일이 HTML을 생성

<script> 
dojoConfig = {async: true} 
</script> 
<script src="http://ajax.googleapis.com/ajax/libs/dojo/1.10.3/dojo/dojo.js"> 

마지막 줄이 압축 된 자바 스크립트의 무리와 방화범에 가까운 스크립트 태그옵니다.

이 코드를 테스트중인 집/index.html.erb에서 변경하지 않았습니다. 응용 프로그램/자산/javaascipts/home.js, 나는이 :

//require(["dojo/dom", "dojo/ready", "dijit/Tooltip"], function(dom, ready, Tooltip) 
define(["dojo/dom", "dojo/ready", "dijit/Tooltip"], function(dom, ready, Tooltip) 
{ 
ready(function() 
{ 
var head = "<div class='footnote-text'>"; 
var tail = "</div>"; 
var fnt1 = head + dom.byId("fnb1").innerHTML + tail; 
var fnt2 = head + dom.byId("fnb2").innerHTML + tail; 
var fnt4 = head + dom.byId("fnb4").innerHTML + tail; 

new Tooltip({ connectId: ["footnote1"],position:["after","above","below"],label: fnt1 }); 
new Tooltip({ connectId: ["footnote2"],position:["after","above","below"],label: fnt2 }); 
new Tooltip({ connectId: ["footnote4"],position:["after","above","below"],label: fnt4 }); 
new Tooltip({ connectId: ["footnote5"],position:["after","above","below"],label: fnt4 }); 
}); 
}); 
//require(["dojo/dom", "dojo/ready", "dijit/Dialog"], function(dom, ready, Dialog){ 
define(["dojo/dom", "dojo/ready", "dijit/Dialog"], function(dom, ready, Dialog){ 
ready(function(){ 
var fnt3 = dom.byId("fnb3").innerHTML; 

myDialog = new Dialog({ 
    title: "Contact Me", 
    content: fnt3, 
    style: "width: 300px" 
}); 
}); 
}); 

가 주석 라인 내 심포니 응용 프로그램에서 사용하는 무엇인가가 필요합니다. 보시다시피, 나는 dojo 사이트에서 설명한대로이를 정의로 바 꾸었습니다. 내가 실행할 때 Firebug 콘솔에서 다음과 같은 오류가 발생합니다.

ReferenceError: define is not defined 
...define(["dojo/dom", "dojo/ready", "dijit/Tooltip"], function(dom, ready, Tooltip 

정의 대신 require를 사용하면 require가 정의되지 않습니다.

업데이트

나는 응용 프로그램에 도장을 설치 시도하고 일부 진전을했다. dojo에서 vendor/assets/javascript/dojo로 다운로드를 복사했다. 도장 디렉토리는 그때 응용 프로그램/자산/자바 스크립트/application.js에

//= require dojo/dojo/dojo.js 

추가 하위 디렉토리 도장, DojoX는, 그리고 자리

가 포함되어 있습니다. 또한 home.js 파일에서 require로 다시 정의를 변경했습니다. 페이지를 새로 고침 할 때 툴팁을 찾을 수 없다는 오류 메시지가 나타났습니다. 그 다음에 다음을 추가했습니다.

//= require dojo/dijit/Tooltip.js 

누락시 다른 누락 된 js 파일에 대해 불만을 표시합니다. 이것은 symfony를 사용했을 때와 같은 문제입니다. 그래서 Google 이미지로갔습니다. 공급 업체 디렉토리에있는 파일을 검색하려면 어떻게해야합니까? require_tree 앱 자산 근무 때문에, 나는 그것뿐만 아니라 공급 업체에 작동 할 수 있습니다 생각이

"NetworkError: 404 Not Found - http://amcolan.loc/dijit/_base/manager.js" 

업데이트 :이 오류 중 하나입니다. 나는 application.js 파일에

//= require_tree ../../../vendor/assets/javascripts/dojo 

을 추가했습니다. 페이지를 새로 고침하면 약 1 분이 걸렸습니다. 내 생각 엔 dojo 디렉토리 트리에있는 모든 것을로드한다는 것입니다. 놀라운 일은 아닙니다. 페이지로드가 오류없이 완료되었습니다. 도구 설명 항목 (코드의 목적은 툴팁을 나타 내기위한 것임) 위에 마우스를 가져 가면 약 2,000 개의 오류가 발생하여 종료되었습니다.모든 오류로 나타납니다

업데이트 3

나는 googleapi를 사용하여 다시 갔다 "ReferenceError가 정의가 정의되어 있지 않습니다." 내 application.html.erb 헤더는 다음과 같습니다.

<head> 
    <meta charset="UTF-8"> 
    <title><%= content_for?(:title) ? yield(:title) : "American Colonial Ancestors" %></title> 
    <%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track' => true %> 
    <script>dojoConfig = {async: true}</script> 
    <%= javascript_include_tag 'http://ajax.googleapis.com/ajax/libs/dojo/1.10.3/dojo/dojo.js'%> 
    <%= javascript_include_tag 'application', 'data-turbolinks-track' => true %> 
    <%= csrf_meta_tags %> 
</head> 

자바 스크립트의 순서가 바뀌 었습니다. 페이지가 오류없이 다시로드되었습니다. 도구 설명이 작동하지 않지만 항목 위에 마우스를 올리면 오류가 발생하지 않습니다. 나는 home.js 코드에 나쁜 문장을 넣었고 콘솔에 코드가 파싱된다는 것을 알았다. 내 페이지 설정에 버그가있을 수 있습니다.

+0

''닫기가 누락 된 것 같습니다. 이렇게하면'dojo.js '가 로딩되지 않을 수있다. 'dojo.js'는'define'과'require'의 정의를 포함하고 있습니다. 'define()'은 모듈을 정의하기위한 것이고'Require()'는 모듈을 적재하기위한 것입니다. 'define()'대신'require()'를 사용해야합니다. – frank

+0

앞서 언급했듯이 생성 된 코드는 모두 포함하지 않았습니다. 또한, define 대신에 require를 사용하면 같은 결과를 얻는다. 내가 지정한 것 이외의 다른 곳을 원하셨습니까? – curt

+0

'home.js '가'index.html'에서 어떻게 호출되고 있습니까? 전체 코드를 게시 할 수 있다면 더 좋습니다. 어떻게 든 require와 define 모듈이 로딩되지 않고 따라서'ReferenceError : define is defined'가됩니다. – frank

답변

0

Dojo 툴킷을 Ruby on Rails와 함께 사용할 수있는 방법은 여러 가지가있을 수 있습니다. 이것은 가장 효율적인 방법이 아니라면 가장 쉽습니다. 이것은 Rails 4.2.0에서 작동합니다. 나는 다른 버전에서도 잘 동작 할 것이라고 생각한다. 최근에

<script>dojoConfig = {async: true}</script> 
<%= javascript_include_tag 'http://ajax.googleapis.com/ajax/libs/dojo/1.10.3/dojo/dojo.js'%> 

변경합니다 버전을하거나하는 어느 하나의 당신이 사용하고자하는 :보기/레이아웃에서

는/다음 이전 사이트 스크립트의 포함에 추가 application.html.erb. 여기 버전 1.10.3을 사용하고 있습니다. 도장 사이트에는 소스 코드에 대한 다른 CDN (Content Delivery Network)이 있다고합니다. 나는 그들의 예에서와 같이 Google을 사용하고 있습니다.

: 당신이 등 툴킷의 대화 상자, 툴팁 중 하나를 사용하려는 경우

<head> 
    <meta charset="UTF-8"> 
    <%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track' => true %> 
    <%= stylesheet_link_tag "http://ajax.googleapis.com/ajax/libs/dojo/1.10.3/dijit/themes/claro/claro.css" %> 
    <script>dojoConfig = {async: true}</script> 
    <%= javascript_include_tag 'http://ajax.googleapis.com/ajax/libs/dojo/1.10.3/dojo/dojo.js'%> 
    <%= javascript_include_tag 'application', 'data-turbolinks-track' => true %> 
    <%= content_for :page_script %> 
    <%= csrf_meta_tags %> 
</head> 

,이 같은 것을 추가하여 stytlesheet을 포함해야합니다 : 여기에 내 머리 부분의 관련 부품은

<%= stylesheet_link_tag "http://ajax.googleapis.com/ajax/libs/dojo/1.10.3/dijit/themes/claro/claro.css" %> 

버전 및 테마를 자신의 요구 사항으로 변경하십시오. 여기 claro 테마를 사용하고 있습니다. 위 머리 부분에서 볼 수 있습니다. 나는 배치가 중요하다고 생각하지 않는다. 또한 body 문에서 테마 클래스를 선언해야합니다. 여기에 내는 다음과 같습니다

주제에 older post
<body class="claro"> 

다른 자바 스크립트 서식을했다. 나는 특별한 것이 필요하다고 생각하지 않는다. 다음은 작업 스크립트의 예입니다.

require(["dojo/dom", "dojo/ready", "dijit/Tooltip"], function(dom, ready, Tooltip) 
{ 
    ready(function() 
    { 
    var head = "<div class='footnote-text'>"; 
    var tail = "</div>"; 
    var fnt1 = head + dom.byId("fnb1").innerHTML + tail; 
    var fnt2 = head + dom.byId("fnb2").innerHTML + tail; 

    new Tooltip({connectId: ["footnote1"], position:["after","above","below"], label: fnt1 }); 
    new Tooltip({connectId: ["footnote2"], position:["after","above","below"], label: fnt2 }); 
    }); 
}); 

제 질문에서 언급했듯이 Dojo Toolkit 소스를 vendor/assets/javascript에 배치했습니다. 버전 1.7부터는 dojo가 AMD (Asynchronous Module Definition)를 사용하여 시작되었습니다. AMD 로더가 Rails 사전 컴파일 기능과 호환되지 않을 수 있습니다. 나는 확실히 말할 충분한 것을 모른다.