From f8139e5a6e016ae75c55aef0e52059990cecf7d3 Mon Sep 17 00:00:00 2001
From: gtmnayan <50981692+gtm-nayan@users.noreply.github.com>
Date: Tue, 20 Jun 2023 12:48:58 +0545
Subject: [PATCH 1/2] chore(site): fix build (#8762)
* fix: 404 instead of 500
* omit legacy entrypoints
* fix prefetch
---
...19-04-22-svelte-3-rethinking-reactivity.md | 4 +--
sites/svelte.dev/package.json | 1 -
sites/svelte.dev/scripts/type-gen/index.js | 7 ++++-
sites/svelte.dev/src/app.html | 2 +-
sites/svelte.dev/src/lib/server/docs/index.js | 31 ++++++++++---------
.../src/routes/docs/[slug]/+page.server.js | 2 +-
6 files changed, 26 insertions(+), 21 deletions(-)
diff --git a/documentation/blog/2019-04-22-svelte-3-rethinking-reactivity.md b/documentation/blog/2019-04-22-svelte-3-rethinking-reactivity.md
index 03ba6aa56b..a4dd7b2b3b 100644
--- a/documentation/blog/2019-04-22-svelte-3-rethinking-reactivity.md
+++ b/documentation/blog/2019-04-22-svelte-3-rethinking-reactivity.md
@@ -36,7 +36,7 @@ To make that possible we first needed to rethink the concept at the heart of mod
In old Svelte, you would tell the computer that some state had changed by calling the `this.set` method:
```js
-// @errors: 7017
+// @noErrors
const { count } = this.get();
this.set({
count: count + 1
@@ -46,7 +46,7 @@ this.set({
That would cause the component to _react_. Speaking of which, `this.set` is almost identical to the `this.setState` method used in classical (pre-hooks) React:
```js
-// @errors: 7017
+// @noErrors
const { count } = this.state;
this.setState({
count: count + 1
diff --git a/sites/svelte.dev/package.json b/sites/svelte.dev/package.json
index 2c9d4c5bb9..0e692e733f 100644
--- a/sites/svelte.dev/package.json
+++ b/sites/svelte.dev/package.json
@@ -2,7 +2,6 @@
"name": "svelte.dev",
"private": true,
"version": "1.0.0",
- "private": true,
"description": "Docs and examples for Svelte",
"type": "module",
"scripts": {
diff --git a/sites/svelte.dev/scripts/type-gen/index.js b/sites/svelte.dev/scripts/type-gen/index.js
index 790ea54d1a..bd4f364438 100644
--- a/sites/svelte.dev/scripts/type-gen/index.js
+++ b/sites/svelte.dev/scripts/type-gen/index.js
@@ -257,7 +257,12 @@ function read_d_ts_file(file) {
// @ts-ignore
const name = statement.name.text || statement.name.escapedText;
- if (name === '*.svelte' || name === 'svelte/types/compiler/preprocess') {
+ const ignore_list = [
+ '*.svelte',
+ 'svelte/types/compiler/preprocess', // legacy entrypoints, omit from docs
+ 'svelte/types/compiler/interfaces' // legacy entrypoints, omit from docs
+ ];
+ if (ignore_list.includes(name)) {
continue;
}
diff --git a/sites/svelte.dev/src/app.html b/sites/svelte.dev/src/app.html
index 7ad34b9933..95358c7924 100644
--- a/sites/svelte.dev/src/app.html
+++ b/sites/svelte.dev/src/app.html
@@ -29,7 +29,7 @@
%sveltekit.head%
-
+
%sveltekit.body%
diff --git a/sites/svelte.dev/src/lib/server/docs/index.js b/sites/svelte.dev/src/lib/server/docs/index.js
index b8730c6387..a958c26785 100644
--- a/sites/svelte.dev/src/lib/server/docs/index.js
+++ b/sites/svelte.dev/src/lib/server/docs/index.js
@@ -16,16 +16,18 @@ import { render_markdown } from '../markdown/renderer.js';
* @param {string} slug
*/
export async function get_parsed_docs(docs_data, slug) {
- const page = docs_data
- .find(({ pages }) => pages.find((page) => slug === page.slug))
- ?.pages.find((page) => slug === page.slug);
-
- if (!page) return null;
+ for (const { pages } of docs_data) {
+ for (const page of pages) {
+ if (page.slug === slug) {
+ return {
+ ...page,
+ content: await render_markdown(page.file, page.content, { modules })
+ };
+ }
+ }
+ }
- return {
- ...page,
- content: await render_markdown(page.file, page.content, { modules })
- };
+ return null;
}
/** @return {import('./types').DocsData} */
@@ -53,16 +55,15 @@ export function get_docs_data(base = CONTENT_BASE_PATHS.DOCS) {
pages: []
};
- for (const page_md of fs
- .readdirSync(`${base}/${category_dir}`)
- .filter((filename) => filename !== 'meta.json')) {
- const match = /\d{2}-(.+)/.exec(page_md);
+ for (const filename of fs.readdirSync(`${base}/${category_dir}`)) {
+ if (filename === 'meta.json') continue;
+ const match = /\d{2}-(.+)/.exec(filename);
if (!match) continue;
const page_slug = match[1].replace('.md', '');
const page_data = extract_frontmatter(
- fs.readFileSync(`${base}/${category_dir}/${page_md}`, 'utf-8')
+ fs.readFileSync(`${base}/${category_dir}/${filename}`, 'utf-8')
);
if (page_data.metadata.draft === 'true') continue;
@@ -76,7 +77,7 @@ export function get_docs_data(base = CONTENT_BASE_PATHS.DOCS) {
content: page_content,
sections: get_sections(page_content),
path: `${app_base}/docs/${page_slug}`,
- file: `${category_dir}/${page_md}`
+ file: `${category_dir}/${filename}`
});
}
diff --git a/sites/svelte.dev/src/routes/docs/[slug]/+page.server.js b/sites/svelte.dev/src/routes/docs/[slug]/+page.server.js
index 9419befee5..5f808a1ca8 100644
--- a/sites/svelte.dev/src/routes/docs/[slug]/+page.server.js
+++ b/sites/svelte.dev/src/routes/docs/[slug]/+page.server.js
@@ -4,7 +4,7 @@ import { error } from '@sveltejs/kit';
export const prerender = true;
export async function load({ params }) {
- const processed_page = get_parsed_docs(get_docs_data(), params.slug);
+ const processed_page = await get_parsed_docs(get_docs_data(), params.slug);
if (!processed_page) throw error(404);
From 88504ee90a4354222e6d8b0a3960fe935731c2c8 Mon Sep 17 00:00:00 2001
From: Puru Vijay <47742487+PuruVJ@users.noreply.github.com>
Date: Tue, 20 Jun 2023 13:01:31 +0530
Subject: [PATCH 2/2] docs(sites): Auto-generated CompileOptions (#8756)
---------
Co-authored-by: Simon H <5968653+dummdidumm@users.noreply.github.com>
Co-authored-by: Simon Holthausen
---
.../04-compiler-and-api/01-svelte-compiler.md | 109 +---------
.../svelte/src/compiler/compile/Component.js | 5 +-
.../src/compiler/compile/internal_exports.ts | 203 ------------------
packages/svelte/src/compiler/interfaces.d.ts | 180 ++++++++++++++++
packages/svelte/src/compiler/public.d.ts | 2 +-
pnpm-lock.yaml | 8 +-
sites/svelte.dev/package.json | 2 +-
7 files changed, 192 insertions(+), 317 deletions(-)
delete mode 100644 packages/svelte/src/compiler/compile/internal_exports.ts
diff --git a/documentation/docs/04-compiler-and-api/01-svelte-compiler.md b/documentation/docs/04-compiler-and-api/01-svelte-compiler.md
index 124818473d..d08c96c10a 100644
--- a/documentation/docs/04-compiler-and-api/01-svelte-compiler.md
+++ b/documentation/docs/04-compiler-and-api/01-svelte-compiler.md
@@ -29,56 +29,7 @@ const result = compile(source, {
});
```
-The following options can be passed to the compiler. None are required:
-
-
-
-| option | default | description |
-| -------------------- | ------------------------------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
-| `filename` | `null` | `string` used for debugging hints and sourcemaps. Your bundler plugin will set it automatically. |
-| `name` | `"Component"` | `string` that sets the name of the resulting JavaScript class (though the compiler will rename it if it would otherwise conflict with other variables in scope). It will normally be inferred from `filename`. |
-| `generate` | `"dom"` | If `"dom"`, Svelte emits a JavaScript class for mounting to the DOM. If `"ssr"`, Svelte emits an object with a `render` method suitable for server-side rendering. If `false`, no JavaScript or CSS is returned; just metadata. |
-| `errorMode` | `"throw"` | If `"throw"`, Svelte throws when a compilation error occurred. If `"warn"`, Svelte will treat errors as warnings and add them to the warning report. |
-| `varsReport` | `"strict"` | If `"strict"`, Svelte returns a variables report with only variables that are not globals nor internals. If `"full"`, Svelte returns a variables report with all detected variables. If `false`, no variables report is returned. |
-| `dev` | `false` | If `true`, causes extra code to be added to components that will perform runtime checks and provide debugging information during development. |
-| `immutable` | `false` | If `true`, tells the compiler that you promise not to mutate any objects. This allows it to be less conservative about checking whether values have changed. |
-| `hydratable` | `false` | If `true` when generating DOM code, enables the `hydrate: true` runtime option, which allows a component to upgrade existing DOM rather than creating new DOM from scratch. When generating SSR code, this adds markers to `` elements so that hydration knows which to replace. |
-| `legacy` | `false` | If `true`, generates code that will work in IE9 and IE10, which don't support things like `element.dataset`. |
-| `accessors` | `false` | If `true`, getters and setters will be created for the component's props. If `false`, they will only be created for readonly exported values (i.e. those declared with `const`, `class` and `function`). If compiling with `customElement: true` this option defaults to `true`. |
-| `customElement` | `false` | If `true`, tells the compiler to generate a custom element constructor instead of a regular Svelte component. |
-| `tag` | `null` | A `string` that tells Svelte what tag name to register the custom element with. It must be a lowercase alphanumeric string with at least one hyphen, e.g. `"my-element"`. |
-| `css` | `'injected'` | If `'injected'` (formerly `true`), styles will be included in the JavaScript class and injected at runtime for the components actually rendered. If `'external'` (formerly `false`), the CSS will be returned in the `css` field of the compilation result. Most Svelte bundler plugins will set this to `'external'` and use the CSS that is statically generated for better performance, as it will result in smaller JavaScript bundles and the output can be served as cacheable `.css` files. If `'none'`, styles are completely avoided and no CSS output is generated. |
-| `cssHash` | See right | A function that takes a `{ hash, css, name, filename }` argument and returns the string that is used as a classname for scoped CSS. It defaults to returning `svelte-${hash(css)}` |
-| `loopGuardTimeout` | 0 | A `number` that tells Svelte to break the loop if it blocks the thread for more than `loopGuardTimeout` ms. This is useful to prevent infinite loops. **Only available when `dev: true`** |
-| `preserveComments` | `false` | If `true`, your HTML comments will be preserved during server-side rendering. By default, they are stripped out. |
-| `preserveWhitespace` | `false` | If `true`, whitespace inside and between elements is kept as you typed it, rather than removed or collapsed to a single space where possible. |
-| `sourcemap` | `object \| string` | An initial sourcemap that will be merged into the final output sourcemap. This is usually the preprocessor sourcemap. |
-| `enableSourcemap` | `boolean \| { js: boolean; css: boolean; }` | If `true`, Svelte generate sourcemaps for components. Use an object with `js` or `css` for more granular control of sourcemap generation. By default, this is `true`. |
-| `outputFilename` | `null` | A `string` used for your JavaScript sourcemap. |
-| `cssOutputFilename` | `null` | A `string` used for your CSS sourcemap. |
-| `sveltePath` | `"svelte"` | The location of the `svelte` package. Any imports from `svelte` or `svelte/[module]` will be modified accordingly. |
-| `namespace` | `"html"` | The namespace of the element; e.g., `"mathml"`, `"svg"`, `"foreign"`. |
-| `format` | `"esm"` | This option only exists in Svelte 3. In Svelte 4 only ESM can be output. `"esm"` creates a JavaScript module (with `import` and `export`). `"cjs"` creates a CommonJS module (with `require` and `module.exports`). |
+Refer to [CompileOptions](#type-compileoptions) for all the available options.
The returned `result` object contains the code for your component, along with useful bits of metadata.
@@ -96,63 +47,7 @@ import { compile } from 'svelte/compiler';
const { js, css, ast, warnings, vars, stats } = compile(source);
```
-- `js` and `css` are objects with the following properties:
- - `code` is a JavaScript string
- - `map` is a sourcemap with additional `toString()` and `toUrl()` convenience methods
-- `ast` is an abstract syntax tree representing the structure of your component.
-- `warnings` is an array of warning objects that were generated during compilation. Each warning has several properties:
- - `code` is a string identifying the category of warning
- - `message` describes the issue in human-readable terms
- - `start` and `end`, if the warning relates to a specific location, are objects with `line`, `column` and `character` properties
- - `frame`, if applicable, is a string highlighting the offending code with line numbers
-- `vars` is an array of the component's declarations, used by [eslint-plugin-svelte3](https://github.com/sveltejs/eslint-plugin-svelte3) for example. Each variable has several properties:
- - `name` is self-explanatory
- - `export_name` is the name the value is exported as, if it is exported (will match `name` unless you do `export...as`)
- - `injected` is `true` if the declaration is injected by Svelte, rather than in the code you wrote
- - `module` is `true` if the value is declared in a `context="module"` script
- - `mutated` is `true` if the value's properties are assigned to inside the component
- - `reassigned` is `true` if the value is reassigned inside the component
- - `referenced` is `true` if the value is used in the template
- - `referenced_from_script` is `true` if the value is used in the `