Javascript-форум (https://javascript.ru/forum/)
-   ExtJS (https://javascript.ru/forum/extjs/)
-   -   Правильное использование ресурсов (https://javascript.ru/forum/extjs/50838-pravilnoe-ispolzovanie-resursov.html)

Infarch 13.10.2014 17:55

Правильное использование ресурсов
 
Здравствуйте.

Хочу для себя прояснить, как правильно использовать ресурсы в экст приложениях?

Например, я в воркспейсе создаю пакет с компонентами которые будут шарится между моими приложениями, а может и (а вдруг!) продаваться. Один из компонентов требует наличия некоего ресурса, например картинки. Я помещаю ее по такому пути: "c:\workspace\packages\MyPackage\resources\images\ image.gif". Когда приложение использующее этот пакет сбилдано, картинка копируется по адресу "c:\workspace\build\production\MyApp\resources\MyP ackage\images\image.gif".

И вот вопрос: как правильно прописывать ссылку на эту картинку в коде компонента? Могу ли я просто написать "src:''resources/MyPackage/images/image.gif"? Не выйдет ли так что один из пользователей пакета перенастроит пути для билда или еще чего накрутит, и ссылка станет невалидная? Может экст предоставляет какие нибудь специальные переменные которые можно использовать?

skrudjmakdak 16.10.2014 13:42

это стандартная верстка. есть css файл, туда кидайте все ваши стили и указывайте относительный путь к имагам. разумеется пути и имагам пишутся относительно файла css, а не приложения. а абсолютный путь никто не использует, дабы должно быть понятно из каких соображений.

также как и классы в extjs (контроллеры, вьюхи, сторы и т.п.) так и css файлы должны находиться в соответствующей директории, дабы компилятор смог их подобрать и скомпилить в один css файл. ургу к сожалению не дам, не помню. но это расписано

Infarch 16.10.2014 17:41

Ну а если мне урл нужен именно в коде компонента? Ведь ресурсы не ограничиваются только картинками, не все можно загнать в цсс.

Но допустим это картинка. Давайте смоделируем, что мне нужно для того чтоб ее использовать.

Пакет размещен в <workspace>/packages/MyPackage. Относительно расположения пакета, его жаваскрипт файл: src/MyComponent.js.
Картинка лежит в resources/images/picture.png. Описание нужного класса для цсс храним тут: sass/src/MyComponent.scss. Например, так:
.#{$prefix}mycomponent {
    background-image: $my-component-image;
}

И вот мы подобрались к самому главному. Еще один scss файл должен определить переменную $my-component-image: sass/var/MyComponent.scss

$my-component-image : ????

Что тут написать?

Я не уверен что синтаксически первый scss файл правилен. Например когда я просматриваю исходники стандартных тем я вижу такое: background-image: theme-background-image('shared/blue-loading'); или нечто похожее. Но у меня не тема, а компонент. В общем, нужны подсказки...


Часовой пояс GMT +3, время: 05:53.