Как организовать файлы 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

Другие вопросы по тегам