If you found an issue with that, please open an issue.
You may need an appropriate loader to handle this file type. This may hide some unrelated warnings that only apply to Angular. Module parse failed: Unexpected token (4:14) This would be the most elegant solution if you’re comfortable handling Webpack yourself, and leaving the bounds of the CLI itself.ERROR in. Angular pipe is a way to write display-value transformations that you can.
, // make sure you install the loaders for your project! npm i -D apply-loader pug-loader In fact, you might like to apply them in your HTML templates as you do styles. But for a lot of users, people want to stay within the comforts of the CLI.Īfter ejecting, just look for rules: [ within the ejected nfig file, and add this in the rules array.
Note: For Angular 6+ you can simply run ng add ng-cli-pug-loader to automatically run & add. So another option is that you could ng eject your Webpack configuration from the CLI, and simply add the pug rule yourself. Using PUG (or Jade) templates with the Angular-CLI. That works great with AoT, but you’ll find ng serve doesn’t work anymore. pug.ts TypeScript file string, and you import that result. There are also some packages around that transform your pug files into strings within a.All of your templates now have to point to the compiled html file as well. html files (referencing the html file in your components templateUrl), and set up a gulp watch to check pug files into html, but it’s 2017 - it’s… illegal to use Gulp now isn’t it? (kidding of course). You could use gulp to turn all of your.template: require('pug-loader!./')() I’ve seen a lot of projects do this, and avoiding AoT with ng build -aot=false but by doing that you’re including the compiler in your prod builds, and increasing package size. Don’t try to use require, since it won’t be statically analyzable by the Ahead-of-time compiler (AoT).I have a project which part of it is AngularJS. selector: 'my-thing', templateUrl: './my-thing.pug' // <- how can we get this to work? }) Some things -not- to do Hello, I'm having this issue for so much time already and am always looking for a solution and never found it. If you’ve ever tried to get pug or jade templates working with the Angular CLI, you might have ran into a few random solutions out there, each with their own pros and cons, but nothing super simple.