Json-server: Typescript support

Created on 14 Aug 2018  路  11Comments  路  Source: typicode/json-server

Would be great to see some definitions for this package on https://github.com/DefinitelyTyped/DefinitelyTyped/

Most helpful comment

That works, unfortunately without --watch but we can use nodemon for that.

Here is a full example:

npm i npm json-server @types/json-server -D

json-server.ts

import { db } from './db';

// Start json-server
const jsonServer  = require('json-server');
const server      = jsonServer.create();
const router      = jsonServer.router(db);
const middlewares = jsonServer.defaults();
const port        = 3000;

server.use(middlewares);
server.use(router);
server.listen(port, () => {
  console.log(`JSON Server is running on port ${port}`);
});

db.ts

interface DB {
  posts: Post[];
  comments: Comment[];
  profile: Profile;
}

export const db: DB = {
  posts:    [
    // ...
  ],
  comments: [
    // ...
  ],
  profile:  {
    // ...
  },
};

ts-node json-server.ts or nodemon --exec ts-node json-server.ts

All 11 comments

The whole project is not working with ts files. I would rather want it to work with ts-files which should be a quickfix instead of definition files.

Works:
json-server --watch db.js

Does not work:
json-server --watch db.ts

I'm really wanting this too. It makes so much sense defining interfaces for all the API contracts you'd like to configure. Especially if the frontend will be Angular you can reuse the same interfaces. If we simply point json-server to the compiled typescript would it work? In which case how to setup an empty nodejs project with typescript. I'd die to see a boilerplate setup for TypeScript & json-server.

Of course it would work if you precompile to JS but thats very unhandy

Just did it: https://github.com/DefinitelyTyped/DefinitelyTyped/pull/31107

npm install -D @types/json-server

yarn add -D @types/json-server

馃檪

Is this working now?

json-server --watch db.ts

No, just that the programmatic use of json-server (https://github.com/typicode/json-server#module) is now properly typed, as OP asked.

What you want is doable with that programmatic use and ts-node (https://github.com/TypeStrong/ts-node).

That works, unfortunately without --watch but we can use nodemon for that.

Here is a full example:

npm i npm json-server @types/json-server -D

json-server.ts

import { db } from './db';

// Start json-server
const jsonServer  = require('json-server');
const server      = jsonServer.create();
const router      = jsonServer.router(db);
const middlewares = jsonServer.defaults();
const port        = 3000;

server.use(middlewares);
server.use(router);
server.listen(port, () => {
  console.log(`JSON Server is running on port ${port}`);
});

db.ts

interface DB {
  posts: Post[];
  comments: Comment[];
  profile: Profile;
}

export const db: DB = {
  posts:    [
    // ...
  ],
  comments: [
    // ...
  ],
  profile:  {
    // ...
  },
};

ts-node json-server.ts or nodemon --exec ts-node json-server.ts

ts-node json-server.ts

Can you ellaborta how you got the export working? I am getting the error: 'unexpected token {' ont he import db line. I am developing on angular 7 and running

kill-port 3000 && concurrently --kill-others "nodemon --exec ts-node json-server.ts" "ng serve\""

to fix the "unexpected token" I changed inside tsconfig.json compilerOptions module from es2015 to
"module": "commonjs", nevertheless would be nice to have support for a db.ts ouf the box

I just submitted https://github.com/typicode/json-server/pull/994 to allow the CLI to use files with extensions other than .js to allow it to load the DB from a TypeScript file. The only thing you would need to do once this is merged and published is registering the ts-node loader directly in the node executable by doing:

NODE_OPTIONS="--require ts-node/register" json-server db.ts

hi, i had the same issue: i found this and its works:
nodemon --ext ts --watch src --exec './node_modules/.bin/ts-node' src/www.ts
see resource: https://github.com/jamg44/NodeTyped/blob/master/package.json#L10

Was this page helpful?
0 / 5 - 0 ratings