Material Design CSS/JS совместно используется приложением Angular 2 и статической html-страницей

Наше приложение Angular 2 использует фреймворк Material Design. Приложение станет локально обслуживаемым (бессерверным) веб-приложением на встроенном программном обеспечении. Для повышения производительности мы сочли необходимым использовать статический HTML-код, отличный от Angular, в определенных ситуациях из-за времени загрузки нескольких мест в приложении.

Я хочу, чтобы наш программист UI/UX мог использовать как можно больше компонентов с префиксом md и анимаций CSS/JS на статических html-страницах. Другими словами, я хочу, чтобы они могли кодировать пользовательский интерфейс на статической странице так же, как они кодируют его в шаблоне Angular 2, или как можно ближе к тому же.

Я также хотел бы, чтобы изменения или любые настройки, которые они вносят в CSS или JS, были разделены между шаблонами Angular 2 и статическими html-страницами, поскольку они должны иметь одинаковый внешний вид и должны выглядеть так, как будто они являются частью одного и того же приложения. .

Я знаю, что существуют различные способы реализации материального дизайна без Angular 2. (бутстрап, полимер и т. д.). Кто-нибудь знает чистый способ сделать кодирование бесшовным между Angular 2 и не-Angular частями веб-приложения?


person Jonathan Walton    schedule 17.01.2017    source источник


Ответы (1)


Насколько я могу судить, существует несколько реализаций материального дизайна (https://material.io/guidelines/) для различных фреймворков. Следующее, что можно использовать на статической html-странице, не требуя всеобъемлющей структуры, такой как Angular 2:

...Просто назвать несколько. Мы остановились на реализации Polymer. Это связано с тем, что синтаксис полимера очень похож на угловой. (оба созданы Google) Полимерные префиксы с «бумагой-» вместо «md-», но в остальном они очень похожи, и мы можем добавить оба этих префикса к любым переопределениям в наших файлах .scss, которые могут использоваться совместно между шаблонами angular и статические html-файлы, когда нам нужно переопределить стили по умолчанию.

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

Все еще интересны другие решения этой проблемы, если у кого-то есть другие идеи.

person Jonathan Walton    schedule 18.01.2017