Глобальные переменные пера

У меня есть core.styl, куда я помещаю свой стиль сетки, некоторые функции стилуса и некоторые переменные. Этот файл должен быть импортирован во все мои маршруты.

Кроме того, у меня есть page.styl, который зависит от моего текущего маршрута (например, contact.styl для /contact)

Примечание. Мой проект основан на angular.js, поэтому html-заголовок не меняется. Но я могу добавить кое-что с помощью angular в html-head, например .

Я пытался следовать

//index.html
<link rel="stylesheet" href="/css/core.css" /> <-- this is static, always there>
                               
<link rel="stylesheet" href="/css/pages/contact.css" /> <--- added by angular

Проблема: в contact.styl у меня нет доступа к переменным и функциям стилуса (объявленным в core.styl)

одно решение: @import '../core.styl' в каждой таблице стилей страницы. Но для меня исключено.

Есть ли другое решение, которое я могу попробовать?

Может что-то подобное (server.js)?

function compile(str, path) {
	return stylus(str)
		.import(config.path_client + "/css/core")
		.set('filename', path)
		.set('warn', true)
		.set('compress', true);
}
app.use(stylus.middleware({
	src: config.path_client + '/css/pages',
	compile: compile
}));
(tried very long but still doesnt work for me)

Изменить: Моя файловая структура:

|client
||css
|||pages
||||-contact.styl
||||-contact.css
|||base
||||-core.styl
||||-core.css
|server
||-server.js
|


person Mangocrack    schedule 05.03.2015    source источник


Ответы (1)


Вы можете использовать JS API и определить эти переменные, используя метод define. См. http://learnboost.github.io/stylus/docs/js.html#definename-node

person Panya    schedule 06.03.2015
comment
разве это, наконец, не то же самое, что и первое решение, о котором я упоминал, где я сделал '@'import 'core.styl'? Или, может быть, я не понимаю это правильно, поэтому, если поправьте меня, пожалуйста: я делаю .set('filename', '/myvars.styl').define(myvars), а затем делаю '@'import 'myvars.styl' ИЛИ ​​я делаю . set('filename', path).define(myvars) что myvars напрямую импортируются, например. контакт.css. Таким образом, оба заканчиваются тем же, что и myvars, например. файл contact.styl определен или? --нет ли способа определить эти переменные полностью независимо от любого файла .styl/.css? - person Mangocrack; 07.03.2015
comment
Из вашего вопроса кажется, что это именно то, что вам нужно (определенные глобальные переменные и функции будут доступны внутри contact.styl без их импорта в файл core.styl. - person Panya; 07.03.2015
comment
Они будут полностью независимыми (они просто глобальные). - person Panya; 07.03.2015
comment
хорошо, спасибо, это отлично работает для меня :) теперь я должен найти способ определить все мои vars и fns видимым образом .. может быть, файл .json - person Mangocrack; 07.03.2015
comment
Итак, наконец, у меня есть гораздо больше, чем просто несколько переменных и функций ... и я использую jeet (набор функций). Есть ли способ определить эти функции все сразу? что-то вроде этого .define(allmyfunction.styl)? - person Mangocrack; 07.03.2015
comment
Вы можете использовать метод import (learnboost.github.io/stylus/docs/js. html#путь_импорта) - person Panya; 07.03.2015
comment
Также вы можете написать полный плагин и использовать метод use (learnboost.github.io/ стилус/docs/js.html#usefn) - person Panya; 07.03.2015
comment
предпочитаю плагин ... поэтому мне нужно написать js-функцию, которая автоматически оборачивает все мои функции/переменные стилуса в блок define() (возможно, сохранить их раньше в файле json)? - person Mangocrack; 07.03.2015