opensource/json-server
1
0
Fork 0
mirror of https://github.com/typicode/json-server.git synced 2025-07-27 12:12:41 +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": { "scripts": {
"css": "tailwindcss -i ./views/input.css -o ./public/output.css", "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", "watch-css": "npm run css -- --watch",
"dev": "concurrently npm:watch-*", "dev": "concurrently npm:watch-*",
"build": "rm -rf lib && tsc && npm run css", "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()) app.use(json())
// Static files // Static files
app.use(sirv(join(__dirname, '../public'))) app.use(sirv(join(__dirname, '../public'), { dev: !isProduction }))
options.static options.static
?.map((path) => (isAbsolute(path) ? path : join(process.cwd(), path))) ?.map((path) => (isAbsolute(path) ? path : join(process.cwd(), path)))
.forEach((dir) => app.use(sirv(dir, { dev: !isProduction }))) .forEach((dir) => app.use(sirv(dir, { dev: !isProduction })))

23
src/bin.ts
View File

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

30
views/index.html
View File

@ -7,26 +7,32 @@
<link href="/output.css" rel="stylesheet" /> <link href="/output.css" rel="stylesheet" />
</head> </head>
<body class="container mx-auto prose"> <body class="container mx-auto prose pt-6 bg-white text-gray-900">
<header> <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> </header>
<main> <main class="my-12">
<h2>Routes</h2> <% if (Object.keys(it.data).length === 0) { %>
<ul class="font-mono"> <p>No resources found in JSON file</p>
<% } %>
<% Object.entries(it.data).forEach(function([name]) { %> <% Object.entries(it.data).forEach(function([name]) { %>
<li> <div class="py-1">
<a href="<%= name %>"> <a href="<%= name %>">
/<%= name %> /<%= name %>
</a> </a>
</li> </div>
<% }) %> <% }) %>
</ul>
</main> </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> </body>
</html> </html>