mirror of https://github.com/sveltejs/svelte
feat(site-2): Fully remove api.svelte.dev (#8432)
* Localize the examples dependents * Localize FAQ * Try to fix examples API * Remove examples api * Prerender, use vercel adapter, disable PUT action for now * Don't call get_examples_data on top * Move repl PUT to its own routew * Don't prerender REPL page * Change console warn * Prerender tutorial the smart way * Use getContext in root * work around some weird content encoding glitch * Try the pre-generate route * Apply the suggestions * Fix embed examples * Remove comment * remove commented-out code * Update sites/svelte.dev/src/routes/_components/Demo.svelte Co-authored-by: Rich Harris <richard.a.harris@gmail.com> * remove unused code * add note to self, remove ts-ignore * move adapter-vercel to devDependencies * remove some unused deps * huh we need flexsearch after all? weird * we need sourcemap-codec as well — what the hell. are these deps missing from a dep? --------- Co-authored-by: Rich Harris <git@rich-harris.dev> Co-authored-by: Rich Harris <richard.a.harris@gmail.com>pull/8453/head
Puru Vijay
2 years ago
committed by
GitHub
parent
9793b41817
commit
5976de8f82
File diff suppressed because it is too large
Load Diff
@ -1,57 +1,56 @@
|
||||
{
|
||||
"name": "svelte.dev",
|
||||
"version": "1.0.0",
|
||||
"description": "Docs and examples for Svelte",
|
||||
"type": "module",
|
||||
"scripts": {
|
||||
"dev": "node scripts/update.js && vite dev",
|
||||
"build": "node scripts/update.js && vite build",
|
||||
"update": "node scripts/update.js --force=true",
|
||||
"preview": "vite preview",
|
||||
"start": "node build",
|
||||
"check": "svelte-kit sync && svelte-check --tsconfig ./jsconfig.json",
|
||||
"check:watch": "svelte-kit sync && svelte-check --tsconfig ./jsconfig.json --watch",
|
||||
"format": "npm run check:format -- --write",
|
||||
"check:format": "prettier --check . --ignore-path .gitignore --plugin-search-dir=.",
|
||||
"test": "uvu -r ts-node/register src/lib/server/markdown"
|
||||
},
|
||||
"dependencies": {
|
||||
"@supabase/supabase-js": "^2.11.0",
|
||||
"@sveltejs/repl": "^0.2.0",
|
||||
"cookie": "^0.5.0",
|
||||
"devalue": "^4.3.0",
|
||||
"do-not-zip": "^1.0.0",
|
||||
"flexsearch": "^0.7.31",
|
||||
"flru": "^1.0.2",
|
||||
"sourcemap-codec": "^1.4.8",
|
||||
"svelte-local-storage-store": "^0.4.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@resvg/resvg-js": "^2.4.1",
|
||||
"@sveltejs/adapter-auto": "^2.0.0",
|
||||
"@sveltejs/kit": "^1.12.0",
|
||||
"@sveltejs/site-kit": "^3.3.6",
|
||||
"@sveltejs/vite-plugin-svelte": "^2.0.3",
|
||||
"@types/marked": "^4.0.8",
|
||||
"@types/prismjs": "^1.26.0",
|
||||
"degit": "^2.8.4",
|
||||
"dotenv": "^16.0.3",
|
||||
"jimp": "^0.22.7",
|
||||
"marked": "^4.2.12",
|
||||
"node-fetch": "^3.3.1",
|
||||
"prettier": "^2.8.4",
|
||||
"prettier-plugin-svelte": "^2.9.0",
|
||||
"prism-svelte": "^0.5.0",
|
||||
"prismjs": "^1.29.0",
|
||||
"satori": "^0.4.3",
|
||||
"satori-html": "^0.3.2",
|
||||
"shelljs": "^0.8.5",
|
||||
"shiki": "^0.14.1",
|
||||
"shiki-twoslash": "^3.1.1",
|
||||
"svelte": "^3.57.0",
|
||||
"svelte-check": "^3.1.4",
|
||||
"typescript": "^5.0.2",
|
||||
"vite": "^4.2.0",
|
||||
"vite-imagetools": "^4.0.18"
|
||||
}
|
||||
"name": "svelte.dev",
|
||||
"version": "1.0.0",
|
||||
"description": "Docs and examples for Svelte",
|
||||
"type": "module",
|
||||
"scripts": {
|
||||
"dev": "node scripts/generate_examples.js && node scripts/update.js && vite dev",
|
||||
"build": "node scripts/generate_examples.js && node scripts/update.js && vite build",
|
||||
"update": "node scripts/update.js --force=true",
|
||||
"preview": "vite preview",
|
||||
"start": "node build",
|
||||
"check": "svelte-kit sync && svelte-check --tsconfig ./jsconfig.json",
|
||||
"check:watch": "svelte-kit sync && svelte-check --tsconfig ./jsconfig.json --watch",
|
||||
"format": "npm run check:format -- --write",
|
||||
"check:format": "prettier --check . --ignore-path .gitignore --plugin-search-dir=.",
|
||||
"test": "uvu -r ts-node/register src/lib/server/markdown"
|
||||
},
|
||||
"dependencies": {
|
||||
"@supabase/supabase-js": "^2.11.0",
|
||||
"@sveltejs/repl": "^0.2.0",
|
||||
"cookie": "^0.5.0",
|
||||
"devalue": "^4.3.0",
|
||||
"do-not-zip": "^1.0.0",
|
||||
"flexsearch": "^0.7.31",
|
||||
"flru": "^1.0.2",
|
||||
"sourcemap-codec": "^1.4.8"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@resvg/resvg-js": "^2.4.1",
|
||||
"@sveltejs/adapter-vercel": "^2.4.1",
|
||||
"@sveltejs/kit": "^1.12.0",
|
||||
"@sveltejs/site-kit": "^3.3.6",
|
||||
"@sveltejs/vite-plugin-svelte": "^2.0.3",
|
||||
"@types/marked": "^4.0.8",
|
||||
"@types/prismjs": "^1.26.0",
|
||||
"degit": "^2.8.4",
|
||||
"dotenv": "^16.0.3",
|
||||
"jimp": "^0.22.7",
|
||||
"marked": "^4.2.12",
|
||||
"node-fetch": "^3.3.1",
|
||||
"prettier": "^2.8.4",
|
||||
"prettier-plugin-svelte": "^2.9.0",
|
||||
"prism-svelte": "^0.5.0",
|
||||
"prismjs": "^1.29.0",
|
||||
"satori": "^0.4.3",
|
||||
"satori-html": "^0.3.2",
|
||||
"shelljs": "^0.8.5",
|
||||
"shiki": "^0.14.1",
|
||||
"shiki-twoslash": "^3.1.1",
|
||||
"svelte": "^3.57.0",
|
||||
"svelte-check": "^3.1.4",
|
||||
"typescript": "^5.0.2",
|
||||
"vite": "^4.2.0",
|
||||
"vite-imagetools": "^4.0.18"
|
||||
}
|
||||
}
|
||||
|
||||
@ -0,0 +1,13 @@
|
||||
import { get_examples_data } from '../src/lib/server/examples/get-examples.js';
|
||||
import fs from 'node:fs';
|
||||
|
||||
const examples_data = get_examples_data(
|
||||
new URL('../../../site/content/examples', import.meta.url).pathname
|
||||
);
|
||||
|
||||
fs.mkdirSync(new URL('../src/lib/generated/', import.meta.url), { recursive: true });
|
||||
|
||||
fs.writeFileSync(
|
||||
new URL('../src/lib/generated/examples-data.js', import.meta.url),
|
||||
`export default ${JSON.stringify(examples_data)}`
|
||||
);
|
||||
@ -0,0 +1,24 @@
|
||||
// @ts-check
|
||||
import fs from 'node:fs';
|
||||
import { extract_frontmatter } from '../markdown';
|
||||
|
||||
const base = '../../site/content/faq';
|
||||
|
||||
/**
|
||||
* @returns {import('./types').FAQData}
|
||||
*/
|
||||
export function get_faq_data() {
|
||||
const faqs = [];
|
||||
|
||||
for (const file of fs.readdirSync(base)) {
|
||||
const { metadata, body } = extract_frontmatter(fs.readFileSync(`${base}/${file}`, 'utf-8'));
|
||||
|
||||
faqs.push({
|
||||
title: metadata.question, // Initialise with empty
|
||||
slug: file.split('-').slice(1).join('-').replace('.md', ''),
|
||||
content: body,
|
||||
});
|
||||
}
|
||||
|
||||
return faqs;
|
||||
}
|
||||
@ -0,0 +1,87 @@
|
||||
// @ts-check
|
||||
import { createShikiHighlighter } from 'shiki-twoslash';
|
||||
import { transform } from '../markdown';
|
||||
|
||||
const languages = {
|
||||
bash: 'bash',
|
||||
env: 'bash',
|
||||
html: 'svelte',
|
||||
svelte: 'svelte',
|
||||
sv: 'svelte',
|
||||
js: 'javascript',
|
||||
css: 'css',
|
||||
diff: 'diff',
|
||||
ts: 'typescript',
|
||||
'': '',
|
||||
};
|
||||
|
||||
/**
|
||||
* @param {import('./types').FAQData} faq_data
|
||||
*/
|
||||
export async function get_parsed_faq(faq_data) {
|
||||
const highlighter = await createShikiHighlighter({ theme: 'css-variables' });
|
||||
|
||||
return Promise.all(
|
||||
faq_data.map(async ({ content, slug, title }) => {
|
||||
return {
|
||||
title,
|
||||
slug,
|
||||
content: transform(content, {
|
||||
/**
|
||||
* @param {string} html
|
||||
*/
|
||||
heading(html) {
|
||||
const title = html
|
||||
.replace(/<\/?code>/g, '')
|
||||
.replace(/"/g, '"')
|
||||
.replace(/</g, '<')
|
||||
.replace(/>/g, '>');
|
||||
|
||||
return title;
|
||||
},
|
||||
code: (source, language) => {
|
||||
let html = '';
|
||||
|
||||
source = source
|
||||
.replace(/^([\-\+])?((?: )+)/gm, (match, prefix = '', spaces) => {
|
||||
if (prefix && language !== 'diff') return match;
|
||||
|
||||
// for no good reason at all, marked replaces tabs with spaces
|
||||
let tabs = '';
|
||||
for (let i = 0; i < spaces.length; i += 4) {
|
||||
tabs += ' ';
|
||||
}
|
||||
return prefix + tabs;
|
||||
})
|
||||
.replace(/\*\\\//g, '*/');
|
||||
|
||||
html = highlighter.codeToHtml(source, { lang: languages[language] });
|
||||
|
||||
html = html
|
||||
.replace(
|
||||
/^(\s+)<span class="token comment">([\s\S]+?)<\/span>\n/gm,
|
||||
(match, intro_whitespace, content) => {
|
||||
// we use some CSS trickery to make comments break onto multiple lines while preserving indentation
|
||||
const lines = (intro_whitespace + content + '').split('\n');
|
||||
return lines
|
||||
.map((line) => {
|
||||
const match = /^(\s*)(.*)/.exec(line);
|
||||
const indent = (match?.[1] ?? '').replace(/\t/g, ' ').length;
|
||||
|
||||
return `<span class="token comment wrapped" style="--indent: ${indent}ch">${
|
||||
line ?? ''
|
||||
}</span>`;
|
||||
})
|
||||
.join('');
|
||||
}
|
||||
)
|
||||
.replace(/\/\*…\*\//g, '…');
|
||||
|
||||
return html;
|
||||
},
|
||||
codespan: (text) => '<code>' + text + '</code>',
|
||||
}),
|
||||
};
|
||||
})
|
||||
);
|
||||
}
|
||||
@ -0,0 +1,5 @@
|
||||
export type FAQData = {
|
||||
title: string;
|
||||
slug: string;
|
||||
content: string;
|
||||
}[];
|
||||
@ -0,0 +1,14 @@
|
||||
import * as gist from '$lib/db/gist';
|
||||
import * as session from '$lib/db/session';
|
||||
import { error } from '@sveltejs/kit';
|
||||
|
||||
// TODO reimplement as an action
|
||||
export async function PUT({ params, request }) {
|
||||
const user = await session.from_cookie(request.headers.get('cookie'));
|
||||
if (!user) throw error(401, 'Unauthorized');
|
||||
|
||||
const body = await request.json();
|
||||
await gist.update(user, params.id, body);
|
||||
|
||||
return new Response(undefined, { status: 204 });
|
||||
}
|
||||
@ -0,0 +1,8 @@
|
||||
// @ts-check
|
||||
import examples_data from '$lib/generated/examples-data.js';
|
||||
import { get_examples_list } from '$lib/server/examples/get-examples';
|
||||
import { json } from '@sveltejs/kit';
|
||||
|
||||
export const GET = () => {
|
||||
return json(get_examples_list(examples_data));
|
||||
};
|
||||
@ -0,0 +1,17 @@
|
||||
import examples_data from '$lib/generated/examples-data.js';
|
||||
import { get_example } from '$lib/server/examples';
|
||||
import { get_examples_list } from '$lib/server/examples/get-examples';
|
||||
import { error, json } from '@sveltejs/kit';
|
||||
|
||||
export const GET = ({ params }) => {
|
||||
const examples = new Set(
|
||||
get_examples_list(examples_data)
|
||||
.map((category) => category.examples)
|
||||
.flat()
|
||||
.map((example) => example.slug)
|
||||
);
|
||||
|
||||
if (!examples.has(params.slug)) throw error(404, 'Example not found');
|
||||
|
||||
return json(get_example(examples_data, params.slug));
|
||||
};
|
||||
@ -1,12 +0,0 @@
|
||||
import { PUBLIC_API_BASE } from '$env/static/public';
|
||||
|
||||
/** @type {import('./$types').PageLoad} */
|
||||
export async function load({ fetch, setHeaders }) {
|
||||
const faqs = await fetch(`${PUBLIC_API_BASE}/docs/svelte/faq?content`).then((r) => r.json());
|
||||
|
||||
setHeaders({
|
||||
'cache-control': 'public, max-age=60'
|
||||
});
|
||||
|
||||
return { faqs };
|
||||
}
|
||||
@ -0,0 +1,8 @@
|
||||
import { get_parsed_faq } from '$lib/server/faq';
|
||||
import { get_faq_data } from '$lib/server/faq/get-faq';
|
||||
|
||||
export const prerender = true;
|
||||
|
||||
export async function load() {
|
||||
return { faqs: get_parsed_faq(get_faq_data()) };
|
||||
}
|
||||
Loading…
Reference in new issue