6/11/2023 0 Comments Pug template angular![]() When adding any new pug file after npm start, the new file is not watched. There are a few tradeoffs using this approach. selector: 'my-root', templateUrl: './', styleUrls: }) export class AppComponent Please notes that in your component typescript, you still refer to. If you are using pug, you might not want to check in the generated HTML files. However, if all your developers are on Linux or Mac, then you don’t need any 3rd party packages, just replace start command with npm run pug-it:w & npm run server will do. You can install it: npm install npm-run-all -save-dev The run-p command is provided by the package. If you want to run multiple tasks concurrently cross platforms (mac, windows, etc), 3rd party packages like concurrently and npm-run-all are helpful. Before we run build, we run pug before that (during prebuild`). ![]() When running npm start, we will start the dev server and and the pug watch tasks concurrently."ng": "ng", "start": "run-p pug-it:w server", "server": "ng serve -port 4210", "prebuild": "yarn run pug-it", "build": "ng build", We use this command during development to watch the file changes and recompile automatically. The second command did exactly the same thing with additional file watching. The first command `pug-it` will compile all the. npm install pug-cli -save-devĪfter installation, we create two scripts in package.json`: "pug-it": "pug src", "pug-it:w": "pug src -P -w" Pug CLI allows you to compile pug with command like pug ` and watch the changes. However, if you are using Angular (version 2 or 4) & the de-facto Angular-CLI, the pug option is not out of the box, probably yet. doctype html html head meta(charset="utf-8") title my portal body app-root div.root-spinner img.loading(src="assets/images/logo.png") Pug allow me to write cleaner HTML.įrom HTML like this:- my portal
0 Comments
Leave a Reply. |