Angular2 with Haml

Question

Можно ли использовать HAML в качестве шаблона в Angular 2?

В Angular 2 (версия 2.3.1) вы можете использовать scss/sass вместо css. Это заданный вариант angular-cli с --style. Для шаблонов cli позволяет изменять только встроенный шаблон, установив --inline-template.

Если это не поддерживается, как я должен настроить свой Угловое 2 приложения (созданный угловой Cli версии 1.0.0-beta.26) написать HAML, скомпилировать его HTML и использовать HTML в component как templateUrl?

EDIT Угловой/cli использует веб-пакет. Я не знаю, как настроить webpack для рендеринга haml в html, прежде чем все будет в комплекте. Как использовать haml-loader внутри углового?

Answer 1

Это должно быть возможно, но только с файлами внешних шаблонов (templateUrl). Вы должны настроить свою систему здания (webpack, gulp) для предварительной обработки всех шаблонов, прежде чем они будут использоваться угловыми

Answer 2

Да, это определенно возможно. Если вы используете angular-cli, вам сначала нужно будет получить доступ к файлу webcack.config.js. Вы можете сделать это, набрав

$ ng eject 

Это откроет файл конфигурации, который вам необходимо отредактировать. Обратите внимание, что после этого вам нужно будет запустить ваш сервер с «npm start» вместо «ng serve».

Для Haml вы можете использовать haml-haml-loader

npm install haml-haml-loader --save-dev 

Тогда по вашим правилам модуля в webpack.config.js файл добавить следующее правило:

module: { 
    rules: [ 
    ... 
    { 
     test: /\.haml$/, 
     loaders: ['haml-haml-loader'] 
    }, 
    ... 

Наконец модифицировать компонент к используйте ваш файл «haml» следующим образом:

@Component({ 
    selector: 'app', 
    template: require('./app.component.haml'), 
    styleUrls: ['./app.component.sass'], 
}) 

В качестве альтернативы вы можете использовать

templateUrl: './app.component.haml', 

Это должно получить вас и работает с Haml