How can I include pug templates in compiled typescript

0 votes

My nodejs based application uses Pug for rendering; specifically, i set the view engine and then set the view directory (which lives inside of the src directory that all other source lives in.

app.set('view engine', 'pug');
app.set('views', __dirname + '/views');
[...]
res.render('login')

This works correctly for the development version, which simply runs and interprets the typescript file that the above code is in. However, I would like to compile to javascript in production, and have the following (seemingly standard) typescript configuration:

{
    "compilerOptions": {
        "target": "esnext",
        "module": "CommonJS",
        "esModuleInterop": true,
        "skipLibCheck": true,
        "forceConsistentCasingInFileNames": true,
        "outDir":"./dist",
        "rootDir": "./src"
    },
    "$schema": "https://json.schemastore.org/tsconfig",
    "display": "Recommended",
    "files": ["src/index.ts"],
}

Which reflects the directory structure of my code:

the directory structure of my source code.

Unfortunately, this fails to work when the application is compiled and ruins index.js; it cannot find the .pug files in /dist/views: Error: Failed to lookup view "posts" in views directory "/app/dist/views"

I understand the error message, but not how to fix the problem. Should I be copying the templates to that folder as part of the build process? Should I be invoking them in another way that the compiler can 'understand' and include? Is compiling typescript to javascript simply an obsolete build step entirely?

Jul 13, 2022 in TypeSript by Logan
• 2,140 points
1,598 views

No answer to this question. Be the first to respond.

Your answer

Your name to display (optional):
Privacy: Your email address will only be used for sending these notifications.
0 votes

Should I be copying the templates to that folder as part of the build process?

Yes 

answered Oct 14, 2022 by hijarian

edited Mar 5

Related Questions In TypeSript

0 votes
1 answer

How can I define a type for a CSS color in TypeScript?

There was a proposal for a type of ...READ MORE

answered Jun 15, 2022 in TypeSript by Nina
• 3,060 points
4,784 views
0 votes
1 answer

How do I extend a TypeScript class definition in a separate definition file?

If you don't have control over the ...READ MORE

answered Jun 10, 2022 in TypeSript by Nina
• 3,060 points
2,987 views
0 votes
0 answers

How can I create a navigational compass using Typescript and HTML?

I'm looking to display a compass heading ...READ MORE

Jul 13, 2022 in TypeSript by Logan
• 2,140 points
727 views
0 votes
1 answer

How to create ES6 Map in Typescript

Refer this as an example this.configs = new ...READ MORE

answered May 31, 2022 in TypeSript by Nina
• 3,060 points
1,037 views
0 votes
1 answer

What is TypeScript and why would I use it in place of JavaScript?

TypeScript is a superset of JavaScript which primarily ...READ MORE

answered May 31, 2022 in TypeSript by Nina
• 3,060 points
776 views
0 votes
1 answer

How to declare and initialize a Dictionary in Typescript

Apparently this doesn't work when passing the ...READ MORE

answered May 31, 2022 in TypeSript by Nina
• 3,060 points
6,855 views
0 votes
0 answers
0 votes
1 answer

How to send Bitcoins with node.js?

This website https://blockr.io/tx/push will successfully do the ...READ MORE

answered Jul 20, 2018 in Blockchain by Christine
• 15,790 points
3,525 views
0 votes
1 answer

Running a childProcess as shell script with node.js server

Here's what I think, you could pass ...READ MORE

answered Aug 14, 2018 in IoT (Internet of Things) by DataKing99
• 8,250 points
876 views
webinar REGISTER FOR FREE WEBINAR X
REGISTER NOW
webinar_success Thank you for registering Join Edureka Meetup community for 100+ Free Webinars each month JOIN MEETUP GROUP