Как организовать файлы js, css и scss для правильного импорта и конвейерной обработки?
Недавно я купил тему с активами в папках активов, как:-
1) assets/js/something.js
2) assets/css/something.cs
3) assets/sass/main.scss (with import statements for files inside 3 no. dashboard folder and sub-folders inside dashboard)
4) assets/sass/dashboard/_variable.scss
5) assets/sass/dashboard/mixins/something.scss
6) assets/img/something.jpg
7) assets/img/faces/some.png
Теперь мне нужно использовать тему в конвейере активов рельсов и организовать как:
1) сохранил все файлы *.js выше (1) нет. внутри папки /app/assets/javascripts и в файле application.js код:-
require rails-ujs
require turbolinks
require_tree .
(JS файлы импортируются и я думаю, что никаких ошибок, так как все файлы находятся в каталоге javascripts)
2) все файлы *.css хранятся в /app/assets/stylesheets из пункта 2 выше.
3) хранит assets / sass / main.scss в пункте 3 выше в /app/assets/stylesheets.
4) сохранил папку панели инструментов в пункте 4 выше в /app/assets/stylesheets, а содержимое файла application.css выглядит так:
require_self
require_tree .
Я думаю, что это должно работать, так как все CSS импортируются с помощью require_tree . И "main.scss" имеет импорт для файлов из каталога панели инструментов. Но я получаю "Переменная не найдена $font-weight-bold sass error" из переменной, определенной в "_variables.scss", импортированной из файла "main.scss". Как я могу решить это и какой должна быть организация активов.
Спасибо вам всем.
1 ответ
Способ, которым я настроил мой, работает, но я не знаю, если его соглашение (- означает папку, + означает файл):
-stylesheets
-base
+ globals.scss
+ mixins.scss
+ normalize.scss
+ variables.scss
- styles
+ login.scss
+ applicaion.css.scss
require_self
require main
+ mains.scss here is where i import all the files
@import "base/mixins.scss";
@import "base/normalize.scss";
@import "base/globals.scss";
@import "base/variables.scss";
// login
@import "styles/login.scss";
- javasctipts
+ application.js
//= require something
//= require_tree
+ something.js
и изображения в папке asssts/image