opensource/json-server
1
0
Fork 0
mirror of https://github.com/typicode/json-server.git synced 2025-07-26 11:48:20 +08:00
Code Issues Packages Projects Releases Wiki Activity

Update package.json and app.ts, fix file validation in bin.ts, and modify index.html

Browse Source
This commit is contained in:
typicode
2023-12-27 01:35:59 +01:00
parent 34f881d387
commit a74c0c2268
4 changed files with 42 additions and 25 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
package.json
View File

@ -11,7 +11,7 @@
],
"scripts": {
"css": "tailwindcss -i ./views/input.css -o ./public/output.css",
"watch-ts": "tsx watch src/bin.ts db.json",
"watch-ts": "tsx watch src/bin.ts fixtures/db.json",
"watch-css": "npm run css -- --watch",
"dev": "concurrently npm:watch-*",
"build": "rm -rf lib && tsc && npm run css",

2
src/app.ts
View File

@ -33,7 +33,7 @@ export function createApp(db: Low<Data>, options: AppOptions = {}) {
app.use(json())
// Static files
app.use(sirv(join(__dirname, '../public')))
app.use(sirv(join(__dirname, '../public'), { dev: !isProduction }))
options.static
?.map((path) => (isAbsolute(path) ? path : join(process.cwd(), path)))
.forEach((dir) => app.use(sirv(dir, { dev: !isProduction })))

23
src/bin.ts
View File

@ -1,5 +1,5 @@
#!/usr/bin/env node
import { readFileSync } from 'node:fs'
import { existsSync, readFileSync } from 'node:fs'
import { extname, join } from 'node:path'
import { parseArgs } from 'node:util'
@ -41,7 +41,7 @@ const { values, positionals } = parseArgs({
})
if (values.help || positionals.length === 0) {
console.log(`Usage: json-server [options] [file]
console.log(`Usage: json-server [options] <file>
Options:
-p, --port <port> Port (default: 3000)
-h, --host <host> Host (default: localhost)
@ -59,10 +59,21 @@ if (values.version) {
}
// App args and options
const file = positionals[0] ?? 'db.json'
const file = positionals[0] ?? ''
const port = parseInt(values.port ?? process.env['PORT'] ?? '3000')
const host = values.host ?? process.env['HOST'] ?? 'localhost'
// Check file
if (file === '') {
console.log('No file specified')
process.exit(1)
}
if (!existsSync(file)) {
console.log(`File ${file} not found`)
process.exit(1)
}
// Set up database
let adapter: Adapter<Data>
if (extname(file) === '.json5') {
@ -95,8 +106,8 @@ if (process.env['NODE_ENV'] !== 'production') {
observer.onWriteEnd = () => {
writing = false
}
observer.onReadStart = () => console.log(`reloading ${file}...`)
observer.onReadEnd = () => console.log('reloaded')
observer.onReadStart = () => console.log(`Reloading ${file}...`)
observer.onReadEnd = () => console.log('Reloaded')
watch(file).on('change', () => {
// Do no reload if the file is being written to by the app
if (!writing) {
@ -114,5 +125,5 @@ if (process.env['NODE_ENV'] !== 'production') {
app.listen(port, () => {
console.log(`Started on :${port}`)
console.log(routes(db))
console.log(routes(db).join('\n'))
})

40
views/index.html
View File

@ -7,26 +7,32 @@
<link href="/output.css" rel="stylesheet" />
</head>
<body class="container mx-auto prose">
<body class="container mx-auto prose pt-6 bg-white text-gray-900">
<header>
<h1>JSON Server [alpha]</h1>
<nav class="mx-auto flex items-center justify-between">
<strong>JSON Server {:.:}</strong>
<div class="flex gap-x-6">
<a href="https://github.com/typicode/json-server">
<span class="ml-2">GitHub</span>
</a>
<a href="https://github.com/sponsors/typicode">
<span class="ml-2">Sponsor</span>
</a>
</div>
</nav>
</header>
<main>
<h2>Routes</h2>
<ul class="font-mono">
<% Object.entries(it.data).forEach(function([name]) { %>
<li>
<a href="<%= name %>">
/<%= name %>
</a>
</li>
<% }) %>
</ul>
<main class="my-12">
<% if (Object.keys(it.data).length === 0) { %>
<p>No resources found in JSON file</p>
<% } %>
<% Object.entries(it.data).forEach(function([name]) { %>
<div class="py-1">
<a href="<%= name %>">
/<%= name %>
</a>
</div>
<% }) %>
</main>
<footer class="space-x-4">
<a href="https://github.com/typicode/json-server">🐱 GitHub</a>
<a href="https://github.com/sponsors/typicode">♥ Sponsor</a>
</footer>
</body>
</html>