如何在Jade模板中包含客戶端腳本？

我使用玉生成一個靜態網站寫grunt我想從我的玉模板調用moment.js。如何在Jade模板中包含客戶端腳本？

我不知道我應該如何加載時刻庫。

require.config({ 
    paths: { 
     "moment": "path/to/moment", 
    } 
}); 
define(["moment"], function (moment) { 
    moment().format(); 
});

但我不知道異步加載如何與玉。

所以我寫了這個代碼無法編譯：

doctype html 
html(lang="en") 
    head 
    script(src='scripts/require.js') 
    script. 
     require.config({ 
      paths: { 
       "moment": "scripts/moment.js", 
      } 
     }); 
    body 
    p #{moment(Date.now()).format('MM/DD/YYYY')}

，出現以下錯誤：

>> TypeError: src/test.jade:7 
>>  5|  script. 
>>  6|   require.config({ 
>> > 7|    paths: { 
>>  8|     "moment": "scripts/moment.js", 
>>  9|    } 
>>  10|   }); 
>> 
>> undefined is not a function

我怎麼加載我的時刻對象，因此它可以用在翡翠（模板和mixin）？

Note if I replace the line p #{moment(Date.now()).format('MM/DD/YYYY')} with p #{Date.now()} it compiles.

來源

2015-01-20 Name is carl

我不知道，但錯過縮進是最大的嫌疑人。 Jade是模板引擎。所以你必須按照Jade的方式遵循縮進和其他。 – lv0gun9 2015-01-21 00:03:37

我嘗試了不同的縮進。但無濟於事（我更新了我的問題）。此外，翡翠不需要縮進的JavaScript，對吧？ – 2015-01-21 00:07:15

我對此有疑問。你的jade文件包含requirejs，它叫做momoentjs。順便說一句，你最後的代碼想要在模板上寫入函數結果給html - > html時刻正確嗎？ – lv0gun9 2015-01-21 00:36:26

訣竅就是讓你的JavaScript時可用咕嚕叫玉編譯器生成最終的HTML文件

Note the ouput of the javascript will be statically copied into the html file. The javascript library is a compile time (devDependency) only dependency.

簡單的測試文件

doctype html 
html(lang="en") 
    head 
    body 
    p #{moment(Date.now()).format('MM/DD/YYYY')} 
    p Hello guys !!

咕嚕文件

module.exports = function(grunt){ 
    ... 
    grunt.initConfig({ 
     pkg: grunt.file.readJSON('package.json'), 
     ... 
     moment = require ('moment') ; 
     grunt.registerTask(... 
     ...

包文件

{ 
    "name": "site", 
    ... 
    "devDependencies": { 
    ... 
    "moment": "*" 
    }, 
    "dependencies": { 
    ... 
    } 
}

Thanks to @ForbesLindesay for his help

來源

2015-01-22 00:33:38 lv0gun9

如何在Jade模板中包含客戶端腳本？

回答

相關問題