Add custom-server-typescript example (see #3694)

[retrixe]

Requested in #2744 as well.

[khuezy]

I'm unable to use typescript syntax w/ any ts files under server:

SyntaxError: Unexpected token import

[retrixe]

@khuezy just edited the example, hope it works now, was a mistake on my side with ts-node configuration.

[khuezy]

@retrixe Thanks for getting this out!

I had to escape the " in the the nodemon.json file:
"ts": "ts-node --compilerOptions '{\"module\":\"commonjs\"}'"

[retrixe]

@khuezy Fixed all issues with linting and the escaping issue, 😅 everything works now, thanks for the feedback :)

[khuezy]

@retrixe I'm having trouble building.

I had to change the build script to:
"build": "next build && tsc server/**/*.ts --module commonjs --outDir lib --lib dom,es2015,es2016,es2017"

w/o the outDir it would compile the.js files in the server folder. It looks like it's not reading the tsconfig.json file.

[retrixe]

Huh, I am unable to replicate on my side.
I am able to run the example without any issues?

I have switched the server to use import over require, and I am hoping that this PR is ready for merging.

[khuezy]

in nodemon.json, I think you wanted to watch the .ts files instead of the .js?

[retrixe]

Just fixed that, but it still doesn't seem that that is the issue.

[khuezy]

@retrixe I finally figured out why my build was busted. For some reason, npm installed a really old version of chalk, which caused typescript to explode.

Everything is 👍 now. Thanks for adding this customer server ts support.

[kachkaev]

I just tried your example and it really helped me get a custom ts server! Two questions:

• Do we need "jsx": "preserve", in tsconfig.json like in 97aef52?

• Would not it be better to use production-server dir instead of lib? People may be using this directory for storing shared modules and this can create a glitch.

[retrixe]

@kachkaev

1. By default, the jsx value is preserve, so I do not believe we need to?.. I did not experience an issue with this myself when using VSCode so I cannot say.

2. We can do this, but this can be individually customized as per people's needs and I think as an example we do not need to implement a different directory.

[kachkaev]

@retrixe

1. I'm not sure why, but I had problems until I added preserve. Official docs in https://github.com/zeit/next-plugins/tree/master/packages/next-typescript#usage also mention jsx parameter.

2. Some other Next.js examples do use lib for source files and it is often the case that people start new projects by combining a few examples together (that's what I was doing when I found your PR). I've already renamed lib to production-server in package.json and tsconfig.json in my new project – no big deal. However, this took some time and brain effort. People who are just starting with Next.js or TypeScript may get a bit confused and forget to rename something and then spend an hour on catching a bug they do not understand.

To summarise, I'll be happy to submit a PR that renames lib to production-server and also adds "jsx":"preserve". WDYT?

[retrixe]

@kachkaev no problemo :)

[kachkaev]

One more tiny improvement: #3963