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
parent
9793b41817
commit
5976de8f82
File diff suppressed because it is too large
Load Diff
@ -1,57 +1,56 @@
|
|||||||
{
|
{
|
||||||
"name": "svelte.dev",
|
"name": "svelte.dev",
|
||||||
"version": "1.0.0",
|
"version": "1.0.0",
|
||||||
"description": "Docs and examples for Svelte",
|
"description": "Docs and examples for Svelte",
|
||||||
"type": "module",
|
"type": "module",
|
||||||
"scripts": {
|
"scripts": {
|
||||||
"dev": "node scripts/update.js && vite dev",
|
"dev": "node scripts/generate_examples.js && node scripts/update.js && vite dev",
|
||||||
"build": "node scripts/update.js && vite build",
|
"build": "node scripts/generate_examples.js && node scripts/update.js && vite build",
|
||||||
"update": "node scripts/update.js --force=true",
|
"update": "node scripts/update.js --force=true",
|
||||||
"preview": "vite preview",
|
"preview": "vite preview",
|
||||||
"start": "node build",
|
"start": "node build",
|
||||||
"check": "svelte-kit sync && svelte-check --tsconfig ./jsconfig.json",
|
"check": "svelte-kit sync && svelte-check --tsconfig ./jsconfig.json",
|
||||||
"check:watch": "svelte-kit sync && svelte-check --tsconfig ./jsconfig.json --watch",
|
"check:watch": "svelte-kit sync && svelte-check --tsconfig ./jsconfig.json --watch",
|
||||||
"format": "npm run check:format -- --write",
|
"format": "npm run check:format -- --write",
|
||||||
"check:format": "prettier --check . --ignore-path .gitignore --plugin-search-dir=.",
|
"check:format": "prettier --check . --ignore-path .gitignore --plugin-search-dir=.",
|
||||||
"test": "uvu -r ts-node/register src/lib/server/markdown"
|
"test": "uvu -r ts-node/register src/lib/server/markdown"
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@supabase/supabase-js": "^2.11.0",
|
"@supabase/supabase-js": "^2.11.0",
|
||||||
"@sveltejs/repl": "^0.2.0",
|
"@sveltejs/repl": "^0.2.0",
|
||||||
"cookie": "^0.5.0",
|
"cookie": "^0.5.0",
|
||||||
"devalue": "^4.3.0",
|
"devalue": "^4.3.0",
|
||||||
"do-not-zip": "^1.0.0",
|
"do-not-zip": "^1.0.0",
|
||||||
"flexsearch": "^0.7.31",
|
"flexsearch": "^0.7.31",
|
||||||
"flru": "^1.0.2",
|
"flru": "^1.0.2",
|
||||||
"sourcemap-codec": "^1.4.8",
|
"sourcemap-codec": "^1.4.8"
|
||||||
"svelte-local-storage-store": "^0.4.0"
|
},
|
||||||
},
|
"devDependencies": {
|
||||||
"devDependencies": {
|
"@resvg/resvg-js": "^2.4.1",
|
||||||
"@resvg/resvg-js": "^2.4.1",
|
"@sveltejs/adapter-vercel": "^2.4.1",
|
||||||
"@sveltejs/adapter-auto": "^2.0.0",
|
"@sveltejs/kit": "^1.12.0",
|
||||||
"@sveltejs/kit": "^1.12.0",
|
"@sveltejs/site-kit": "^3.3.6",
|
||||||
"@sveltejs/site-kit": "^3.3.6",
|
"@sveltejs/vite-plugin-svelte": "^2.0.3",
|
||||||
"@sveltejs/vite-plugin-svelte": "^2.0.3",
|
"@types/marked": "^4.0.8",
|
||||||
"@types/marked": "^4.0.8",
|
"@types/prismjs": "^1.26.0",
|
||||||
"@types/prismjs": "^1.26.0",
|
"degit": "^2.8.4",
|
||||||
"degit": "^2.8.4",
|
"dotenv": "^16.0.3",
|
||||||
"dotenv": "^16.0.3",
|
"jimp": "^0.22.7",
|
||||||
"jimp": "^0.22.7",
|
"marked": "^4.2.12",
|
||||||
"marked": "^4.2.12",
|
"node-fetch": "^3.3.1",
|
||||||
"node-fetch": "^3.3.1",
|
"prettier": "^2.8.4",
|
||||||
"prettier": "^2.8.4",
|
"prettier-plugin-svelte": "^2.9.0",
|
||||||
"prettier-plugin-svelte": "^2.9.0",
|
"prism-svelte": "^0.5.0",
|
||||||
"prism-svelte": "^0.5.0",
|
"prismjs": "^1.29.0",
|
||||||
"prismjs": "^1.29.0",
|
"satori": "^0.4.3",
|
||||||
"satori": "^0.4.3",
|
"satori-html": "^0.3.2",
|
||||||
"satori-html": "^0.3.2",
|
"shelljs": "^0.8.5",
|
||||||
"shelljs": "^0.8.5",
|
"shiki": "^0.14.1",
|
||||||
"shiki": "^0.14.1",
|
"shiki-twoslash": "^3.1.1",
|
||||||
"shiki-twoslash": "^3.1.1",
|
"svelte": "^3.57.0",
|
||||||
"svelte": "^3.57.0",
|
"svelte-check": "^3.1.4",
|
||||||
"svelte-check": "^3.1.4",
|
"typescript": "^5.0.2",
|
||||||
"typescript": "^5.0.2",
|
"vite": "^4.2.0",
|
||||||
"vite": "^4.2.0",
|
"vite-imagetools": "^4.0.18"
|
||||||
"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