From 96e3df1c792ac1e790bd66b84bc2f18d5ec622f4 Mon Sep 17 00:00:00 2001 From: Scotty Simpson Date: Mon, 22 Apr 2019 21:35:50 -0700 Subject: [PATCH 01/25] typo I'm very helpful --- .../content/tutorial/14-composition/02-slot-fallbacks/text.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/site/content/tutorial/14-composition/02-slot-fallbacks/text.md b/site/content/tutorial/14-composition/02-slot-fallbacks/text.md index c8fbde91dc..fd2ef28fb6 100644 --- a/site/content/tutorial/14-composition/02-slot-fallbacks/text.md +++ b/site/content/tutorial/14-composition/02-slot-fallbacks/text.md @@ -12,7 +12,7 @@ A component can specify *fallbacks* for any slots that are left empty, by puttin ``` -We can now create instances of `` eithout any children: +We can now create instances of `` without any children: ```html @@ -21,4 +21,4 @@ We can now create instances of `` eithout any children: -``` \ No newline at end of file +``` From 57735d49821d63506637197aa6c2f21eb5efd97c Mon Sep 17 00:00:00 2001 From: Jesse Wicks Date: Tue, 23 Apr 2019 00:18:07 -0500 Subject: [PATCH 02/25] fix tutorial link --- site/content/tutorial/06-bindings/11-bind-this/text.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/site/content/tutorial/06-bindings/11-bind-this/text.md b/site/content/tutorial/06-bindings/11-bind-this/text.md index e1aed607b0..25a7bc9169 100644 --- a/site/content/tutorial/06-bindings/11-bind-this/text.md +++ b/site/content/tutorial/06-bindings/11-bind-this/text.md @@ -12,4 +12,4 @@ The readonly `this` binding applies to every element (and component) and allows > ``` -Note that the value of `canvas` will be `undefined` until the component has mounted, so we put the logic inside the `onMount` [lifecycle function](tutorials/onmount). \ No newline at end of file +Note that the value of `canvas` will be `undefined` until the component has mounted, so we put the logic inside the `onMount` [lifecycle function](tutorial/onmount). \ No newline at end of file From 2435c57f47690aafc5e3bbfc7fc80cb86073f62d Mon Sep 17 00:00:00 2001 From: Gregor Aisch Date: Tue, 23 Apr 2019 07:08:50 +0000 Subject: [PATCH 03/25] fix link to CSS in JS blog post --- site/src/routes/index.svelte | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/site/src/routes/index.svelte b/site/src/routes/index.svelte index 3b2447c222..dc31a14df2 100644 --- a/site/src/routes/index.svelte +++ b/site/src/routes/index.svelte @@ -173,7 +173,7 @@
-

CSS is component-scoped by default — no more style collisions or specificity wars. Or you can use your favourite CSS-in-JS library.

+

CSS is component-scoped by default — no more style collisions or specificity wars. Or you can use your favourite CSS-in-JS library.

From e7885f2cb11ccd5545ddf98f487546f6a83449b2 Mon Sep 17 00:00:00 2001 From: Conduitry Date: Tue, 23 Apr 2019 06:42:47 -0400 Subject: [PATCH 04/25] site: more link fixes in blog posts --- .../blog/2016-11-26-frameworks-without-the-framework.md | 4 ++-- .../2017-12-31-sapper-towards-the-ideal-web-app-framework.md | 2 +- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/site/content/blog/2016-11-26-frameworks-without-the-framework.md b/site/content/blog/2016-11-26-frameworks-without-the-framework.md index 933b0fbc48..4efac90b52 100644 --- a/site/content/blog/2016-11-26-frameworks-without-the-framework.md +++ b/site/content/blog/2016-11-26-frameworks-without-the-framework.md @@ -28,7 +28,7 @@ Given that, what if the framework *didn't actually run in the browser*? What if, ## Introducing Svelte -Svelte is a new framework that does exactly that. You write your components using HTML, CSS and JavaScript (plus a few extra bits you can [learn in under 5 minutes](/guide)), and during your build process Svelte compiles them into tiny standalone JavaScript modules. By statically analysing the component template, we can make sure that the browser does as little work as possible. +Svelte is a new framework that does exactly that. You write your components using HTML, CSS and JavaScript (plus a few extra bits you can [learn in under 5 minutes](https://v2.svelte.dev/guide)), and during your build process Svelte compiles them into tiny standalone JavaScript modules. By statically analysing the component template, we can make sure that the browser does as little work as possible. The [Svelte implementation of TodoMVC](http://svelte-todomvc.surge.sh/) weighs 3.6kb zipped. For comparison, React plus ReactDOM *without any app code* weighs about 45kb zipped. It takes about 10x as long for the browser just to evaluate React as it does for Svelte to be up and running with an interactive TodoMVC. @@ -52,4 +52,4 @@ Finally, something I've wrestled with a great deal as an open source maintainer: Svelte is very new. There's a lot of work still left to do – creating build tool integrations, adding a server-side renderer, hot reloading, transitions, more documentation and examples, starter kits, and so on. -But you can already build rich components with it, which is why we've gone straight to a stable 1.0.0 release. [Read the guide](/guide), [try it out in the REPL](/repl), and head over to [GitHub](https://github.com/sveltejs/svelte) to help kickstart the next era of front end development. +But you can already build rich components with it, which is why we've gone straight to a stable 1.0.0 release. [Read the guide](https://v2.svelte.dev/guide), [try it out in the REPL](/repl), and head over to [GitHub](https://github.com/sveltejs/svelte) to help kickstart the next era of front end development. diff --git a/site/content/blog/2017-12-31-sapper-towards-the-ideal-web-app-framework.md b/site/content/blog/2017-12-31-sapper-towards-the-ideal-web-app-framework.md index 790b0fabac..040e95a8c3 100644 --- a/site/content/blog/2017-12-31-sapper-towards-the-ideal-web-app-framework.md +++ b/site/content/blog/2017-12-31-sapper-towards-the-ideal-web-app-framework.md @@ -28,7 +28,7 @@ Everything else flows from that breakthrough design decision. Finding the code r But it's not perfect. As churlish as it might be to list the flaws in something *so, so good*, there are some: * Next uses something called 'route masking' to create nice URLs (e.g. `/blog/hello-world` instead of `/post?slug=hello-world`). This undermines the guarantee about directory structure corresponding to app structure, and forces you to maintain configuration that translates between the two forms -* All your routes are assumed to be universal 'pages'. But it's very common to need routes that only render on the server, such as a 301 redirect or an [API endpoint](/api/blog/sapper-towards-the-ideal-web-app-framework) that serves the data for your pages, and Next doesn't have a great solution for this. You can add logic to your `server.js` file to handle these cases, but it feels at odds with the declarative approach taken for pages +* All your routes are assumed to be universal 'pages'. But it's very common to need routes that only render on the server, such as a 301 redirect or an [API endpoint](/blog/sapper-towards-the-ideal-web-app-framework.json) that serves the data for your pages, and Next doesn't have a great solution for this. You can add logic to your `server.js` file to handle these cases, but it feels at odds with the declarative approach taken for pages * To use the client-side router, links can't be standard `` tags. Instead, you have to use framework-specific `` components, which is impossible in the markdown content for a blog post such as this one, for example The real problem, though, is that all that goodness comes for a price. The simplest possible Next app — a single 'hello world' page that renders some static text — involves 66kb of gzipped JavaScript. Unzipped, it's 204kb, which is a non-trivial amount of code for a mobile device to parse at a time when performance is a critical factor determining whether or not your users will stick around. And that's the *baseline*. From 791b12776e7da7f5a5cd5a034efe620324ea58e1 Mon Sep 17 00:00:00 2001 From: Konstantin Alikhanov Date: Tue, 23 Apr 2019 18:20:22 +0400 Subject: [PATCH 05/25] Fixing issue with cursor jumping in Safari #2506 --- src/compile/render-dom/wrappers/Element/Binding.ts | 10 +++++++++- 1 file changed, 9 insertions(+), 1 deletion(-) diff --git a/src/compile/render-dom/wrappers/Element/Binding.ts b/src/compile/render-dom/wrappers/Element/Binding.ts index 828d664001..a34a9466fc 100644 --- a/src/compile/render-dom/wrappers/Element/Binding.ts +++ b/src/compile/render-dom/wrappers/Element/Binding.ts @@ -111,7 +111,7 @@ export default class BindingWrapper { let update_conditions: string[] = this.needs_lock ? [`!${lock}`] : []; - const dependency_array = [...this.node.expression.dependencies] + const dependency_array = [...this.node.expression.dependencies]; if (dependency_array.length === 1) { update_conditions.push(`changed.${dependency_array[0]}`) @@ -121,6 +121,14 @@ export default class BindingWrapper { ) } + if (parent.node.name === 'input') { + const type = parent.node.get_static_attribute_value('type'); + + if (type === null || type === "" || type === "text") { + update_conditions.push(`(${parent.var}.${this.node.name} !== ${this.snippet})`) + } + } + // model to view let update_dom = get_dom_updater(parent, this); From 51f2a3b2317738b0146c3276d19dff2000bdddad Mon Sep 17 00:00:00 2001 From: Conduitry Date: Tue, 23 Apr 2019 11:32:37 -0400 Subject: [PATCH 06/25] handle unknown nodes in extract_identifiers (#2510) (#2514) --- src/compile/utils/scope.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/compile/utils/scope.ts b/src/compile/utils/scope.ts index d4427c44ff..20cca46cba 100644 --- a/src/compile/utils/scope.ts +++ b/src/compile/utils/scope.ts @@ -106,7 +106,7 @@ export function extract_names(param: Node) { export function extract_identifiers(param: Node) { const nodes: Node[] = []; - extractors[param.type](nodes, param); + extractors[param.type] && extractors[param.type](nodes, param); return nodes; } From 356a1eb8d935cbf8e11bf6f6dc7086af6644b531 Mon Sep 17 00:00:00 2001 From: Conduitry Date: Tue, 23 Apr 2019 11:39:21 -0400 Subject: [PATCH 07/25] add test --- test/runtime/samples/reactive-value-mutate/_config.js | 3 +++ test/runtime/samples/reactive-value-mutate/main.svelte | 7 +++++++ 2 files changed, 10 insertions(+) create mode 100644 test/runtime/samples/reactive-value-mutate/_config.js create mode 100644 test/runtime/samples/reactive-value-mutate/main.svelte diff --git a/test/runtime/samples/reactive-value-mutate/_config.js b/test/runtime/samples/reactive-value-mutate/_config.js new file mode 100644 index 0000000000..e408816834 --- /dev/null +++ b/test/runtime/samples/reactive-value-mutate/_config.js @@ -0,0 +1,3 @@ +export default { + html: `{"bar":42}` +}; diff --git a/test/runtime/samples/reactive-value-mutate/main.svelte b/test/runtime/samples/reactive-value-mutate/main.svelte new file mode 100644 index 0000000000..59fc5b7eb5 --- /dev/null +++ b/test/runtime/samples/reactive-value-mutate/main.svelte @@ -0,0 +1,7 @@ + + +{JSON.stringify(foo)} From 1865710095241dfe7f8c1f9ebde0323214c75b2b Mon Sep 17 00:00:00 2001 From: Scotty Simpson Date: Tue, 23 Apr 2019 08:40:03 -0700 Subject: [PATCH 08/25] add multiple class toggles example This answers the immediate question I had when I first saw the `class:foo` syntax. --- site/content/docs/02-template-syntax.md | 3 +++ 1 file changed, 3 insertions(+) diff --git a/site/content/docs/02-template-syntax.md b/site/content/docs/02-template-syntax.md index 5bbd7b4e1e..47ac9f6f0e 100644 --- a/site/content/docs/02-template-syntax.md +++ b/site/content/docs/02-template-syntax.md @@ -600,6 +600,9 @@ A `class:` directive provides a shorter way of toggling a class on an element.
...
+ + +
...
``` From 644c02eb54016abdd25efedbbbd5411b68cbd47d Mon Sep 17 00:00:00 2001 From: Scotty Simpson Date: Tue, 23 Apr 2019 09:39:49 -0700 Subject: [PATCH 09/25] is-admin => isAdmin --- site/content/docs/02-template-syntax.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/site/content/docs/02-template-syntax.md b/site/content/docs/02-template-syntax.md index 47ac9f6f0e..37810d0c68 100644 --- a/site/content/docs/02-template-syntax.md +++ b/site/content/docs/02-template-syntax.md @@ -602,7 +602,7 @@ A `class:` directive provides a shorter way of toggling a class on an element.
...
-
...
+
...
``` From 50cf49a8841fc7b9e3e955fef955cb584bf1049f Mon Sep 17 00:00:00 2001 From: Hongarc Date: Wed, 24 Apr 2019 00:56:19 +0700 Subject: [PATCH 10/25] Remove whitespace at end of line --- .../transition-js-if-block-in-each-block-bidi/main.svelte | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/test/runtime/samples/transition-js-if-block-in-each-block-bidi/main.svelte b/test/runtime/samples/transition-js-if-block-in-each-block-bidi/main.svelte index 5d85e51c73..5e8979b2d4 100644 --- a/test/runtime/samples/transition-js-if-block-in-each-block-bidi/main.svelte +++ b/test/runtime/samples/transition-js-if-block-in-each-block-bidi/main.svelte @@ -11,8 +11,8 @@ } -{#each [1, 2, 3, 4, 5, 6, 7, 8, 9, 10] as number} +{#each [1, 2, 3, 4, 5, 6, 7, 8, 9, 10] as number} {#if threshold >= number}
{number}
{/if} -{/each} \ No newline at end of file +{/each} From 2a2aa428a229616b0d72a89774646e072f39f3c6 Mon Sep 17 00:00:00 2001 From: Conduitry Date: Tue, 23 Apr 2019 14:07:54 -0400 Subject: [PATCH 11/25] fix unit test under Node 12 --- test/runtime/samples/binding-select/_config.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/test/runtime/samples/binding-select/_config.js b/test/runtime/samples/binding-select/_config.js index 6fd7e60b2a..a5995061a0 100644 --- a/test/runtime/samples/binding-select/_config.js +++ b/test/runtime/samples/binding-select/_config.js @@ -31,7 +31,7 @@ export default { const select = target.querySelector('select'); const options = [...target.querySelectorAll('option')]; - assert.deepEqual(options, select.options); + assert.deepEqual(options, [...select.options]); assert.equal(component.selected, 'one'); const change = new window.Event('change'); From 8fa676bfb0d9c77324fd704030af1f7ac55df072 Mon Sep 17 00:00:00 2001 From: Conduitry Date: Tue, 23 Apr 2019 14:48:18 -0400 Subject: [PATCH 12/25] site: in examples.json don't return sections with no title --- site/src/routes/examples/index.json.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/site/src/routes/examples/index.json.js b/site/src/routes/examples/index.json.js index 4cb4d9c554..8617d70cab 100644 --- a/site/src/routes/examples/index.json.js +++ b/site/src/routes/examples/index.json.js @@ -5,7 +5,7 @@ let cached; export function get(req, res) { try { if (!cached || process.env.NODE_ENV !== 'production') { - cached = JSON.stringify(get_examples()); + cached = JSON.stringify(get_examples().filter(section => section.title)); } res.writeHead(200, { From f2e1b0ea9973d2f012468d31fdbc6efa8e7e13d2 Mon Sep 17 00:00:00 2001 From: Conduitry Date: Tue, 23 Apr 2019 14:49:25 -0400 Subject: [PATCH 13/25] site: move svelte-css-in-js REPL embed into example --- site/content/blog/2018-12-26-svelte-css-in-js.md | 3 +-- .../20181225-blog-svelte-css-in-js/App.svelte | 10 ++++++++++ .../20181225-blog-svelte-css-in-js/Hero.svelte | 15 +++++++++++++++ .../20181225-blog-svelte-css-in-js/meta.json | 3 +++ site/content/examples/99-embeds/meta.json | 1 + 5 files changed, 30 insertions(+), 2 deletions(-) create mode 100644 site/content/examples/99-embeds/20181225-blog-svelte-css-in-js/App.svelte create mode 100644 site/content/examples/99-embeds/20181225-blog-svelte-css-in-js/Hero.svelte create mode 100644 site/content/examples/99-embeds/20181225-blog-svelte-css-in-js/meta.json create mode 100644 site/content/examples/99-embeds/meta.json diff --git a/site/content/blog/2018-12-26-svelte-css-in-js.md b/site/content/blog/2018-12-26-svelte-css-in-js.md index 5e8e6ed71b..f77eb83206 100644 --- a/site/content/blog/2018-12-26-svelte-css-in-js.md +++ b/site/content/blog/2018-12-26-svelte-css-in-js.md @@ -19,7 +19,7 @@ Here, we're using [Emotion](https://emotion.sh) to generate scoped class names t
@@ -27,4 +27,3 @@ Here, we're using [Emotion](https://emotion.sh) to generate scoped class names t It's important to note that most CSS-in-JS libraries have a runtime library, and many don't support statically extracting styles out into a separate .css file at build time (which is essential for the best performance). You should therefore only use CSS-in-JS if it's necessary for your application! Note that you can mix-and-match — you can still use Svelte's built-in CSS handling alongside a CSS-in-JS library. - diff --git a/site/content/examples/99-embeds/20181225-blog-svelte-css-in-js/App.svelte b/site/content/examples/99-embeds/20181225-blog-svelte-css-in-js/App.svelte new file mode 100644 index 0000000000..c8487abefe --- /dev/null +++ b/site/content/examples/99-embeds/20181225-blog-svelte-css-in-js/App.svelte @@ -0,0 +1,10 @@ + + + + +
+

Did you enjoy your lunch, mom? You drank it fast enough. I know, I just call her Annabelle cause she's shaped like a…she's the belle of the ball! YOU'RE the Chiclet! Not me. Caw ca caw, caw ca caw, caw ca caw! A Colombian cartel that WON'T kidnap and kill you. You go buy a tape recorder and record yourself for a whole day. I think you'll be surprised at some of your phrasing.

+
\ No newline at end of file diff --git a/site/content/examples/99-embeds/20181225-blog-svelte-css-in-js/Hero.svelte b/site/content/examples/99-embeds/20181225-blog-svelte-css-in-js/Hero.svelte new file mode 100644 index 0000000000..9f60c276ce --- /dev/null +++ b/site/content/examples/99-embeds/20181225-blog-svelte-css-in-js/Hero.svelte @@ -0,0 +1,15 @@ + + +
+

+
+
+
CSS
+ in JS +
+ in HTML +
+

+
\ No newline at end of file diff --git a/site/content/examples/99-embeds/20181225-blog-svelte-css-in-js/meta.json b/site/content/examples/99-embeds/20181225-blog-svelte-css-in-js/meta.json new file mode 100644 index 0000000000..eaa2a1da63 --- /dev/null +++ b/site/content/examples/99-embeds/20181225-blog-svelte-css-in-js/meta.json @@ -0,0 +1,3 @@ +{ + "title": "-" +} diff --git a/site/content/examples/99-embeds/meta.json b/site/content/examples/99-embeds/meta.json new file mode 100644 index 0000000000..0967ef424b --- /dev/null +++ b/site/content/examples/99-embeds/meta.json @@ -0,0 +1 @@ +{} From e49db5c65f0013a92e28fd3f749efb587aea17ef Mon Sep 17 00:00:00 2001 From: Conduitry Date: Tue, 23 Apr 2019 14:49:48 -0400 Subject: [PATCH 14/25] site: move write-less-code REPL embed into example --- .../blog/2019-04-20-write-less-code.md | 4 +-- .../20181225-blog-svelte-css-in-js/styles.js | 33 +++++++++++++++++++ .../20190420-blog-write-less-code/App.svelte | 9 +++++ .../20190420-blog-write-less-code/meta.json | 3 ++ 4 files changed, 47 insertions(+), 2 deletions(-) create mode 100644 site/content/examples/99-embeds/20181225-blog-svelte-css-in-js/styles.js create mode 100644 site/content/examples/99-embeds/20190420-blog-write-less-code/App.svelte create mode 100644 site/content/examples/99-embeds/20190420-blog-write-less-code/meta.json diff --git a/site/content/blog/2019-04-20-write-less-code.md b/site/content/blog/2019-04-20-write-less-code.md index daa22b9206..d6c8b77193 100644 --- a/site/content/blog/2019-04-20-write-less-code.md +++ b/site/content/blog/2019-04-20-write-less-code.md @@ -42,7 +42,7 @@ Reducing the amount of code you have to write is an explicit goal of Svelte. To
@@ -161,4 +161,4 @@ In Vue, meanwhile, we have a default export with a `data` function that returns These are just some of the ways that Svelte helps you build user interfaces with a minimum of fuss. There are plenty of others — for example, [reactive declarations](https://svelte.dev/tutorial/reactive-declarations) essentially do the work of React's `useMemo`, `useCallback` and `useEffect` without the boilerplate (or indeed the garbage collection overhead of creating inline functions and arrays on each state change). -How? By choosing a different set of constraints. Because [Svelte is a compiler](blog/frameworks-without-the-framework), we're not bound to the peculiarities of JavaScript: we can *design* a component authoring experience, rather than having to fit it around the semantics of the language. Paradoxically, this results in *more* idiomatic code — for example using variables naturally rather than via proxies or hooks — while delivering significantly more performant apps. \ No newline at end of file +How? By choosing a different set of constraints. Because [Svelte is a compiler](blog/frameworks-without-the-framework), we're not bound to the peculiarities of JavaScript: we can *design* a component authoring experience, rather than having to fit it around the semantics of the language. Paradoxically, this results in *more* idiomatic code — for example using variables naturally rather than via proxies or hooks — while delivering significantly more performant apps. diff --git a/site/content/examples/99-embeds/20181225-blog-svelte-css-in-js/styles.js b/site/content/examples/99-embeds/20181225-blog-svelte-css-in-js/styles.js new file mode 100644 index 0000000000..faf91b13d4 --- /dev/null +++ b/site/content/examples/99-embeds/20181225-blog-svelte-css-in-js/styles.js @@ -0,0 +1,33 @@ +import { css } from 'emotion/dist/emotion.umd.min.js'; + +const brand = '#74D900'; + +export const title = css` + color: ${brand}; + font-size: 1em; + white-space: nowrap; +`; + +export const comicSans = css` + font-family: 'Comic Sans MS'; +`; + +export const box = css` + position: relative; + display: inline-block; + border: 2px solid ${brand}; + line-height: 1; + padding: 4px; + border-radius: 4px; +`; + +export const link = css` + color: inherit; + font-weight: bold; + text-decoration: none; + border-bottom: 1px solid ${brand}; + &:hover { + text-decoration: none; + background: ${brand}; + } +`; \ No newline at end of file diff --git a/site/content/examples/99-embeds/20190420-blog-write-less-code/App.svelte b/site/content/examples/99-embeds/20190420-blog-write-less-code/App.svelte new file mode 100644 index 0000000000..46cf93b0fc --- /dev/null +++ b/site/content/examples/99-embeds/20190420-blog-write-less-code/App.svelte @@ -0,0 +1,9 @@ + + + + + +

{a} + {b} = {a + b}

\ No newline at end of file diff --git a/site/content/examples/99-embeds/20190420-blog-write-less-code/meta.json b/site/content/examples/99-embeds/20190420-blog-write-less-code/meta.json new file mode 100644 index 0000000000..eaa2a1da63 --- /dev/null +++ b/site/content/examples/99-embeds/20190420-blog-write-less-code/meta.json @@ -0,0 +1,3 @@ +{ + "title": "-" +} From 7b632182c3ef4fccb7acf61f8802960672ae257a Mon Sep 17 00:00:00 2001 From: swyx Date: Tue, 23 Apr 2019 14:50:45 -0400 Subject: [PATCH 15/25] update quick start instructions since the front page links to this slightly out of date blogpost - i copied over and updated instructions so otherse wont be as confused as i was... --- ...17-08-07-the-easiest-way-to-get-started.md | 19 ++++++------------- 1 file changed, 6 insertions(+), 13 deletions(-) diff --git a/site/content/blog/2017-08-07-the-easiest-way-to-get-started.md b/site/content/blog/2017-08-07-the-easiest-way-to-get-started.md index 394cee6a69..e91166430c 100644 --- a/site/content/blog/2017-08-07-the-easiest-way-to-get-started.md +++ b/site/content/blog/2017-08-07-the-easiest-way-to-get-started.md @@ -38,28 +38,21 @@ This will serve your app on [localhost:5000](http://localhost:5000) and rebuild When you download from the REPL, you're getting a customised version of the [sveltejs/template](https://github.com/sveltejs/template) repo. You can skip messing around with zip files by using [degit](https://github.com/Rich-Harris/degit), a project scaffolding tool. -In the terminal, install degit globally (you only need to do this once): +In the terminal, you can instantly create a new project like so: ```bash -npm install -g degit -``` - -After that, you can instantly create a new project like so: - -```bash -degit sveltejs/template my-new-project -cd my-new-project - +npx degit sveltejs/template my-svelte-project +cd my-svelte-project npm install -npm run dev +npm run dev & open http://localhost:5000 ``` Once you've tinkered a bit and understood how everything fits together, you can fork [sveltejs/template](https://github.com/sveltejs/template) and start doing this instead: ```bash -degit your-name/template my-new-project +npx degit your-name/template my-new-project ``` And that's it! Do `npm run build` to create a production-ready version of your app, and check the project template's [README](https://github.com/sveltejs/template/blob/master/README.md) for instructions on how to easily deploy your app to the web with [Now](https://zeit.co/now) or [Surge](http://surge.sh/). -You're not restricted to using Rollup — there are also integrations for [webpack](https://github.com/sveltejs/svelte-loader), [Browserify](https://github.com/tehshrike/sveltify) and others, or you can use the [Svelte CLI](https://github.com/sveltejs/svelte-cli) or the [API](https://github.com/sveltejs/svelte/tree/v2#api) directly. If you make a project template using one of these tools, please share it with the [Svelte Discord chatroom](https://discord.gg/yy75DKs), or via [@sveltejs](https://twitter.com/sveltejs) on Twitter! +You're not restricted to using Rollup — there are also integrations for [webpack](https://github.com/sveltejs/svelte-loader), [Browserify](https://github.com/tehshrike/sveltify) and others, or you can use the [Svelte CLI](https://github.com/sveltejs/svelte-cli) (Update from 2019: with Svelte 3 the CLI was deprecated and we now use [sirv-cli](https://www.npmjs.com/package/sirv-cli) in our template. Feel free to use whatever tool you like!) or the [API](https://github.com/sveltejs/svelte/tree/v2#api) directly. If you make a project template using one of these tools, please share it with the [Svelte Discord chatroom](https://discord.gg/yy75DKs), or via [@sveltejs](https://twitter.com/sveltejs) on Twitter! From 6c0aa3b9ef929200fd25a3f1199731d43f5a9c6e Mon Sep 17 00:00:00 2001 From: Rubens Mariuzzo Date: Tue, 23 Apr 2019 14:47:02 -0400 Subject: [PATCH 16/25] Add missing dot. --- README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/README.md b/README.md index ff409c86a9..605eee8fa8 100644 --- a/README.md +++ b/README.md @@ -54,7 +54,7 @@ npm run test -- -g transition ## svelte.dev -The source code for https://svelte.dev, including all the documentation, lives in the [site](site) directory. The site is built with [Sapper](https://sapper.svelte.technology) To develop locally: +The source code for https://svelte.dev, including all the documentation, lives in the [site](site) directory. The site is built with [Sapper](https://sapper.svelte.technology). To develop locally: ```bash cd site From c3905be8d8d4b098908274e510248ce50ece7c7d Mon Sep 17 00:00:00 2001 From: sidgo Date: Wed, 24 Apr 2019 00:32:07 +0530 Subject: [PATCH 17/25] Add Razorpay to WhosUsingSvelte --- site/src/routes/_components/WhosUsingSvelte.svelte | 1 + site/static/organisations/razorpay.svg | 1 + 2 files changed, 2 insertions(+) create mode 100644 site/static/organisations/razorpay.svg diff --git a/site/src/routes/_components/WhosUsingSvelte.svelte b/site/src/routes/_components/WhosUsingSvelte.svelte index a7d4fec78e..1700312055 100644 --- a/site/src/routes/_components/WhosUsingSvelte.svelte +++ b/site/src/routes/_components/WhosUsingSvelte.svelte @@ -52,6 +52,7 @@ Mustlab logo Nesta logo The New York Times logo + Razorpay logo Stone Payments logo + your company?
diff --git a/site/static/organisations/razorpay.svg b/site/static/organisations/razorpay.svg new file mode 100644 index 0000000000..003a1bfc3d --- /dev/null +++ b/site/static/organisations/razorpay.svg @@ -0,0 +1 @@ + \ No newline at end of file From b2e13559087ae2700266848ea246d71a888ecf01 Mon Sep 17 00:00:00 2001 From: John Chesley Date: Wed, 24 Apr 2019 00:19:48 -0400 Subject: [PATCH 18/25] failing test for #2542 --- .../samples/export-function-hoisting/_config.js | 3 +++ .../samples/export-function-hoisting/main.svelte | 11 +++++++++++ 2 files changed, 14 insertions(+) create mode 100644 test/runtime/samples/export-function-hoisting/_config.js create mode 100644 test/runtime/samples/export-function-hoisting/main.svelte diff --git a/test/runtime/samples/export-function-hoisting/_config.js b/test/runtime/samples/export-function-hoisting/_config.js new file mode 100644 index 0000000000..c56851d065 --- /dev/null +++ b/test/runtime/samples/export-function-hoisting/_config.js @@ -0,0 +1,3 @@ +export default { + html: 'Compile plz' +} diff --git a/test/runtime/samples/export-function-hoisting/main.svelte b/test/runtime/samples/export-function-hoisting/main.svelte new file mode 100644 index 0000000000..4b54049ed9 --- /dev/null +++ b/test/runtime/samples/export-function-hoisting/main.svelte @@ -0,0 +1,11 @@ + + +Compile plz From 73aca457d3b720901e8c43945d12a13cf60e64fe Mon Sep 17 00:00:00 2001 From: John Chesley Date: Wed, 24 Apr 2019 00:38:02 -0400 Subject: [PATCH 19/25] fix cycle check for exported functions --- src/compile/Component.ts | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/src/compile/Component.ts b/src/compile/Component.ts index bf2fdf9a5a..7d4aa72f03 100644 --- a/src/compile/Component.ts +++ b/src/compile/Component.ts @@ -1002,9 +1002,11 @@ export default class Component { if (walking.has(other_declaration)) { hoistable = false; + } else if (other_declaration.type === 'ExportNamedDeclaration' && walking.has(other_declaration.declaration)) { + hoistable = false; } else if (!is_hoistable(other_declaration)) { hoistable = false; - } + } } else { From 1f8afcb37e98fe46c0be54dc2ebe3a3389551ec6 Mon Sep 17 00:00:00 2001 From: Vytautas Jakutis Date: Wed, 24 Apr 2019 16:05:32 +0300 Subject: [PATCH 20/25] site: docs: fix a typo in HTML example in template syntax --- site/content/docs/02-template-syntax.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/site/content/docs/02-template-syntax.md b/site/content/docs/02-template-syntax.md index 5bbd7b4e1e..e12d9972df 100644 --- a/site/content/docs/02-template-syntax.md +++ b/site/content/docs/02-template-syntax.md @@ -934,7 +934,7 @@ Named slots allow consumers to target specific areas. They can also have fallbac
No header was provided

Some content between header and footer

- +
``` From 0d5c2466a7c3e664dbe093e6f729659617682dc6 Mon Sep 17 00:00:00 2001 From: Allan Tito Date: Tue, 23 Apr 2019 20:46:43 -0400 Subject: [PATCH 21/25] Added comma --- site/content/tutorial/18-debugging/01-debug/text.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/site/content/tutorial/18-debugging/01-debug/text.md b/site/content/tutorial/18-debugging/01-debug/text.md index 8c9f59d082..76fa77805e 100644 --- a/site/content/tutorial/18-debugging/01-debug/text.md +++ b/site/content/tutorial/18-debugging/01-debug/text.md @@ -2,7 +2,7 @@ title: The @debug tag --- -Occasionally it's useful to inspect a piece of data as it flows through your app. +Occasionally, it's useful to inspect a piece of data as it flows through your app. One approach is to use `console.log(...)` inside your markup. If you want to pause execution, though, you can use the `{@debug ...}` tag with a comma-separated list of values you want to inspect: @@ -12,4 +12,4 @@ One approach is to use `console.log(...)` inside your markup. If you want to pau

Hello {user.firstname}!

``` -If you now open your devtools and start interacting with the `` elements, you'll trigger the debugger as the value of `user` changes. \ No newline at end of file +If you now open your devtools and start interacting with the `` elements, you'll trigger the debugger as the value of `user` changes. From e1b2d5dc28d25d27e4b454200eff9418d51b1d69 Mon Sep 17 00:00:00 2001 From: Allan Tito Date: Wed, 24 Apr 2019 10:20:41 -0400 Subject: [PATCH 22/25] Update text.md, line 34 (#2541) * Added comma * Update text.md; added comma --- .../tutorial/10-transitions/04-custom-css-transitions/text.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/site/content/tutorial/10-transitions/04-custom-css-transitions/text.md b/site/content/tutorial/10-transitions/04-custom-css-transitions/text.md index 4bae964c4c..0745a5924d 100644 --- a/site/content/tutorial/10-transitions/04-custom-css-transitions/text.md +++ b/site/content/tutorial/10-transitions/04-custom-css-transitions/text.md @@ -31,7 +31,7 @@ The `t` value is `0` at the beginning of an intro or the end of an outro, and `1 Most of the time you should return the `css` property and *not* the `tick` property, as CSS animations run off the main thread to prevent jank where possible. Svelte 'simulates' the transition and constructs a CSS animation, then lets it run. -For example the `fade` transition generates a CSS animation somewhat like this: +For example, the `fade` transition generates a CSS animation somewhat like this: ```css 0% { opacity: 0 } @@ -69,4 +69,4 @@ We can get a lot more creative though. Let's make something truly gratuitous: ``` -Remember: with great power comes great responsibility. \ No newline at end of file +Remember: with great power comes great responsibility. From adcd13f6dd406b8081b81586382e05544496cacc Mon Sep 17 00:00:00 2001 From: thollander Date: Tue, 23 Apr 2019 23:48:45 +0200 Subject: [PATCH 23/25] Fix the shadow in scrollbar of docs sidebar --- site/src/routes/docs/index.svelte | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/site/src/routes/docs/index.svelte b/site/src/routes/docs/index.svelte index 07cd1fa191..1dd51db502 100644 --- a/site/src/routes/docs/index.svelte +++ b/site/src/routes/docs/index.svelte @@ -117,7 +117,7 @@ position: absolute; left: 0; bottom: 1.9em; - width: 100%; + width: calc(100% - 1em); height: 2em; background: linear-gradient(to bottom, rgba(255,255,255,0) 0%, rgba(255,255,255,0.7) 50%, rgba(255,255,255,1) 100%); pointer-events: none; From 93f7ecca1d8fb90f7a1f8bfded3b03e0ab9e2b76 Mon Sep 17 00:00:00 2001 From: thollander Date: Tue, 23 Apr 2019 22:57:54 +0200 Subject: [PATCH 24/25] Don't show/hide nav when clicking in docs sidebar - Listens to hashchange event - Changes only the navbar visibilty when scroll not triggered by hashchange Resolves #2456 --- site/src/components/TopNav.svelte | 13 +++++++++++-- 1 file changed, 11 insertions(+), 2 deletions(-) diff --git a/site/src/components/TopNav.svelte b/site/src/components/TopNav.svelte index 4254e99152..49a1be50d1 100644 --- a/site/src/components/TopNav.svelte +++ b/site/src/components/TopNav.svelte @@ -35,12 +35,21 @@ }; }); + // Prevents navbar to show/hide when clicking in docs sidebar + let hash_changed = false; + function handle_hashchange() { + hash_changed = true; + } + let last_scroll = 0; function handle_scroll() { const scroll = window.pageYOffset; - visible = (scroll < 50 || scroll < last_scroll); + if (!hash_changed) { + visible = (scroll < 50 || scroll < last_scroll); + } last_scroll = scroll; + hash_changed = false; } @@ -227,7 +236,7 @@ } - +