...
Alle Assets für ein Plugin sollten in der asset.json definiert werden.
| Codeblock | ||||
|---|---|---|---|---|
| ||||
{
"my/plugin" : [
// asset from path my/plugin/css/button.css
"./css/button.css",
// all files from path my/plugin/js
"./js/*.*",
// all files with the extension .png from folder my/plugin/images
"./images/*.png",
// all files and folders from folder my/plugin/images
"./images/*/*.*",
// assets not from this plugin
"plugin/remote/web_component/font_awesome/css/font-awesome.min.css",
"plugin/remote/web_component/font_awesome/fonts/*.*"
],
// additional assets for some other plugin
"some/other": [
// all images from my/plugin
"public/remote/my/plugin/images/*/*.*"
]
} |
Assets verwenden
Das definierte Asset können Sie mit dem Template-Helper asset verwenden. Dieser liefert eine URL zum Asset im Asset-Ordner.
view.hbs
| Codeblock | ||||||
|---|---|---|---|---|---|---|
| ||||||
// href from link
<link rel="stylesheet" href="{{asset "my/plugin" "css/style.css" }}" type="text/css">
// image
<img src="{{asset "my/plugin" "images/logo.png"}}" /> |
CSS und Javascript
Diese Dateien werden pro Plugin gesammelt und mit jeweils einer Datei ausgeliefert. CSS wird dabei unter css/style.css zusammengeführt und Javascript unter js/script.js.
...