web-dev-qa-db-ja.com

Grailsにjquery.jsを含める方法は？

grails create-appを使用して作成されたGrails 2.0.0プロジェクトがあります。 HTMLファイルとGSPファイルにjquery.jsを含めようとしています。私は成功せずに次のすべてを試しました：

<script type="text/javascript" src="jquery/jquery-1.7.1.js"></script>
<script type="text/javascript" src="jquery/jquery.js"></script>
<g:javascript library="jquery"/>

最初の2つの<script>タグは404 Not Found（Firebugで検証）になります。 <g:javascript>タグは何も含まれません（ソース表示を使用して検証されます）。

私のGrailsアプリケーションのホームページでは、jquery 1.7.1がインストールされていることを示しています（「インストール済みプラグイン」の下）。

Grailsでjquery .jsファイルを含める正しい方法は何ですか？

フォローアップ： .GSPファイル：

<%@ page contentType="text/html;charset=UTF-8" %>
<html>
  <head>
    <title>Test</title>
    <g:javascript library="jquery/jquery"/>
  </head>
  <body>
    <h1>Test</h1>
  </body>
</html>

次のHTMLソースの結果：

<html>
  <head>
    <title>Test</title>

  </head>
  <body>
    <h1>Test</h1>
  </body>
</html>

Jquery.jsが含まれていないことに注意してください。

フォローアップ2：

grails create-appを使用してアプリを作成しています：

13:56:40 ~/grailsDev $ grails create-app helloworld
| Created Grails Application at /Users/steve/grailsDev/helloworld
13:56:57 ~/grailsDev $ cd helloworld/
13:57:06 ~/grailsDev/helloworld $ ls -al web-app/js
total 8
drwxr-xr-x  3 steve  staff  102 Jan 21 13:56 .
drwxr-xr-x  7 steve  staff  238 Dec 15 08:04 ..
-rw-r--r--  1 steve  staff  183 Dec 14 22:56 application.js
13:57:23 ~/grailsDev/helloworld $ grails -version

Grails version: 2.0.0
jquerygrailsgrails-2.0
21
Steve Kuo

どうやら<r:layoutResources/>を<head>に含める必要があるようです（<q:javascript library='jquery' />の後）。以下は実際に機能します：

<%@ page contentType="text/html;charset=UTF-8" %>
<html>
  <head>
    <title>Simple GSP page</title>
    <g:javascript library='jquery' />
    <r:layoutResources/>
  </head>
  <body>
    Place your content here
  </body>
</html>
27
Steve Kuo

Jqueryプラグインは2.0にデフォルトでインストールされます-grails-app/conf/BuildConfig.groovyを参照してください。 GSPでjquery.jsを使用するには、次の行を追加します。

<g:javascript library='jquery' />
5
Burt Beckwith

Steveは、jqueryプラグインをgrails install-plugin jqueryでインストールした後、別のgrailsコマンドを実行して、jqueryファイルをアプリにダウンロードする必要があります。

grails installJQuery

このターゲットは、web-app/js/jquery /の下にjquery-1.7.1.jsとjquery-1.7.1.min.jsをダウンロードしてインストールします

5
Wasim

現在のドキュメントのとおり- http://grails.org/plugin/jquery （Grailsバージョン：1.3> *）2015年9月18日

Installation

JQueryプラグインをインストールするには、プロジェクトのルートフォルダーから次のコマンドを入力します。

grails install-plugin jquery

ターゲット：

grails installJQuery
  • このターゲットは、web-app/js/jquery /にあるjquery-1.4.2.jsとjquery-1.4.2.min.jsをダウンロードしてインストールします

完全なjQueryディストリビューションがダウンロードされ、プロジェクトの/ web-app/js/jQueryフォルダーにインストールされます。

使用法

JQuery経由のAjax

GrailsのアダプティブAJAXサポートがそれ自体をjQueryに適応させるには（デフォルトのプロトタイプではなく、またはYUIやDojoなどの別の選択肢））：

Grails 1.2以降：

この行をレイアウトファイルに追加します

<g:javascript library="jquery" plugin="jquery"/>

そして、あなたのgrails-app/conf/config.groovy

grails.views.javascript.library="jquery"

または、次のように使用できます。

<g:javascript library="jquery" />

（plugin = "jquery"なし）ただし、grails installJQueryターゲットを呼び出す必要があります（[インストール]タブを参照）

4
Nick Grealy

Grails 2.xでは次のこともできます。

grails.resources.modules = {
    core {
        dependsOn 'jquery, jquery-ui'
    }
}

Config.groovy

次に、GSPでHEAD要素に以下を配置します。

<r:require module="core"/>

利点は、依存する他のCSS/JSファイルを指定できることです。これにより、GSPできれいに表示できます。これは、jQuery/jQuery-UIのバージョンをオーバーライドできる場所でもあります。

4
Laurence

Icodeyaでそれについての良いチュートリアルを見ました。 http://www.icodeya.com/2012/09/grails-different-ways-to-import.html

あなたはあなたのgspでこれを行うことができます：

<g:javascript src="myscript.js"/ >

[〜＃〜]または[〜＃〜]Config.groovyでこれを行うことができます：

grails.resources.modules = {
core{
resource url:'/js/jQuery.js' 
} 
myScript { 
resource url:'/js/myScript.js' 
dependsOn 'core' 
}
}

次に、gspでこれを添付できます。

<r:require module="myScript" />
3
ShootingStar

Grails 2.3の更新これは、jQueryの構成のトラブルシューティングに役立ち、gspページから利用できるようになります。

  1. まず最初に、grails install-plugin jqueryコマンドを実行すると、「install-plugin」という古いメッセージで失敗します。 enter image description here

したがって、おそらく次のようにBuildConfig.groovyで構成済みです（注：コンパイルではなくランタイムです）。

plugins {
    // ... some other plugins here ...
    runtime ":jquery:1:11:1"
}

  1. Eclipseを使用している場合は、Fileでjqueryを検索し、ファイルがあるかどうかを確認します。 enter image description here

  2. jsディレクトリが空ではなく、web-appディレクトリ内にあることを確認します。 jsにファイルまたはディレクトリがない場合は、手順2で取得したものからコピーするだけです。 enter image description here

  3. 前述のように、これらの2行の組み合わせは（gspページの上部で）機能するようです。

enter image description here

JQueryがロードする最初のJavaScriptライブラリではない場合、問題が発生する可能性があります。 layouts/main.gspファイルがある場合は確認してください。すべてのページにjqueryを追加して、htmlソースの最上部に配置する必要がある場合があります。

お役に立てば幸いです。

注：この投稿の時点（2015年4月）でGrails 3.0がリリースされ、Grails 2.Xプロジェクトとの互換性がないようですそれらは構成されています。うまくいけば、2.Xの問題を回避するために、より適切に文書化されるでしょう。

0
Salvador Valencia

現在、2015年には、BuildConfig.groovyにruntime ":jquery:1.11.1"を追加するだけで済みます。

0
lxknvlk

<g:javascript library="jquery/jquery"/>

0
Wasim

（JQueryプラグインのページから）<g:javascript library="jquery"/>タグを使用するだけでなく、タグを次のようにするためにプラグインラベルを明示的に追加する必要があることがわかりました。

<g:javascript library="jquery" plugin="jquery"/>

Pluginプロパティを使用する必要がある理由は何ですか？

0
Navonod