From 3c26035f535d4e54a60fde871a75fb4371ccdbe8 Mon Sep 17 00:00:00 2001 From: Austin Crim Date: Mon, 28 Jun 2021 07:02:59 -0500 Subject: [PATCH] Split out specific framework examples (#559) * rename kitchen sink, pull out react example * split out the rest of the examples * align versions Co-authored-by: Austin Crim --- .../.npmrc | 0 .../with-multiple-frameworks/package.json | 15 ++++++++ .../src/components/A.astro | 0 .../src/components/B.astro | 0 .../src/components/PreactCounter.tsx | 0 .../src/components/ReactCounter.jsx | 0 .../src/components/SvelteCounter.svelte | 0 .../src/components/VueCounter.vue | 0 .../src/components/index.ts | 0 .../src/pages/index.astro | 0 examples/with-preact/.npmrc | 2 + .../package.json | 4 +- .../with-preact/src/components/Counter.tsx | 19 ++++++++++ examples/with-preact/src/pages/index.astro | 38 +++++++++++++++++++ examples/with-react/.npmrc | 2 + examples/with-react/package.json | 15 ++++++++ .../with-react/src/components/Counter.jsx | 18 +++++++++ examples/with-react/src/pages/index.astro | 38 +++++++++++++++++++ examples/with-svelte/.npmrc | 2 + examples/with-svelte/package.json | 15 ++++++++ .../with-svelte/src/components/Counter.svelte | 20 ++++++++++ examples/with-svelte/src/pages/index.astro | 38 +++++++++++++++++++ examples/with-vue/.npmrc | 2 + examples/with-vue/package.json | 15 ++++++++ examples/with-vue/src/components/Counter.vue | 27 +++++++++++++ examples/with-vue/src/pages/index.astro | 38 +++++++++++++++++++ 26 files changed, 306 insertions(+), 2 deletions(-) rename examples/{kitchen-sink => with-multiple-frameworks}/.npmrc (100%) create mode 100644 examples/with-multiple-frameworks/package.json rename examples/{kitchen-sink => with-multiple-frameworks}/src/components/A.astro (100%) rename examples/{kitchen-sink => with-multiple-frameworks}/src/components/B.astro (100%) rename examples/{kitchen-sink => with-multiple-frameworks}/src/components/PreactCounter.tsx (100%) rename examples/{kitchen-sink => with-multiple-frameworks}/src/components/ReactCounter.jsx (100%) rename examples/{kitchen-sink => with-multiple-frameworks}/src/components/SvelteCounter.svelte (100%) rename examples/{kitchen-sink => with-multiple-frameworks}/src/components/VueCounter.vue (100%) rename examples/{kitchen-sink => with-multiple-frameworks}/src/components/index.ts (100%) rename examples/{kitchen-sink => with-multiple-frameworks}/src/pages/index.astro (100%) create mode 100644 examples/with-preact/.npmrc rename examples/{kitchen-sink => with-preact}/package.json (75%) create mode 100644 examples/with-preact/src/components/Counter.tsx create mode 100644 examples/with-preact/src/pages/index.astro create mode 100644 examples/with-react/.npmrc create mode 100644 examples/with-react/package.json create mode 100644 examples/with-react/src/components/Counter.jsx create mode 100644 examples/with-react/src/pages/index.astro create mode 100644 examples/with-svelte/.npmrc create mode 100644 examples/with-svelte/package.json create mode 100644 examples/with-svelte/src/components/Counter.svelte create mode 100644 examples/with-svelte/src/pages/index.astro create mode 100644 examples/with-vue/.npmrc create mode 100644 examples/with-vue/package.json create mode 100644 examples/with-vue/src/components/Counter.vue create mode 100644 examples/with-vue/src/pages/index.astro diff --git a/examples/kitchen-sink/.npmrc b/examples/with-multiple-frameworks/.npmrc similarity index 100% rename from examples/kitchen-sink/.npmrc rename to examples/with-multiple-frameworks/.npmrc diff --git a/examples/with-multiple-frameworks/package.json b/examples/with-multiple-frameworks/package.json new file mode 100644 index 0000000000..8213a731fc --- /dev/null +++ b/examples/with-multiple-frameworks/package.json @@ -0,0 +1,15 @@ +{ + "name": "@astrojs/with-multiple-frameworks-example", + "private": true, + "version": "0.0.1", + "scripts": { + "start": "astro dev", + "build": "astro build" + }, + "devDependencies": { + "astro": "^0.15.0" + }, + "snowpack": { + "workspaceRoot": "../.." + } +} diff --git a/examples/kitchen-sink/src/components/A.astro b/examples/with-multiple-frameworks/src/components/A.astro similarity index 100% rename from examples/kitchen-sink/src/components/A.astro rename to examples/with-multiple-frameworks/src/components/A.astro diff --git a/examples/kitchen-sink/src/components/B.astro b/examples/with-multiple-frameworks/src/components/B.astro similarity index 100% rename from examples/kitchen-sink/src/components/B.astro rename to examples/with-multiple-frameworks/src/components/B.astro diff --git a/examples/kitchen-sink/src/components/PreactCounter.tsx b/examples/with-multiple-frameworks/src/components/PreactCounter.tsx similarity index 100% rename from examples/kitchen-sink/src/components/PreactCounter.tsx rename to examples/with-multiple-frameworks/src/components/PreactCounter.tsx diff --git a/examples/kitchen-sink/src/components/ReactCounter.jsx b/examples/with-multiple-frameworks/src/components/ReactCounter.jsx similarity index 100% rename from examples/kitchen-sink/src/components/ReactCounter.jsx rename to examples/with-multiple-frameworks/src/components/ReactCounter.jsx diff --git a/examples/kitchen-sink/src/components/SvelteCounter.svelte b/examples/with-multiple-frameworks/src/components/SvelteCounter.svelte similarity index 100% rename from examples/kitchen-sink/src/components/SvelteCounter.svelte rename to examples/with-multiple-frameworks/src/components/SvelteCounter.svelte diff --git a/examples/kitchen-sink/src/components/VueCounter.vue b/examples/with-multiple-frameworks/src/components/VueCounter.vue similarity index 100% rename from examples/kitchen-sink/src/components/VueCounter.vue rename to examples/with-multiple-frameworks/src/components/VueCounter.vue diff --git a/examples/kitchen-sink/src/components/index.ts b/examples/with-multiple-frameworks/src/components/index.ts similarity index 100% rename from examples/kitchen-sink/src/components/index.ts rename to examples/with-multiple-frameworks/src/components/index.ts diff --git a/examples/kitchen-sink/src/pages/index.astro b/examples/with-multiple-frameworks/src/pages/index.astro similarity index 100% rename from examples/kitchen-sink/src/pages/index.astro rename to examples/with-multiple-frameworks/src/pages/index.astro diff --git a/examples/with-preact/.npmrc b/examples/with-preact/.npmrc new file mode 100644 index 0000000000..0cc653b2c3 --- /dev/null +++ b/examples/with-preact/.npmrc @@ -0,0 +1,2 @@ +## force pnpm to hoist +shamefully-hoist = true \ No newline at end of file diff --git a/examples/kitchen-sink/package.json b/examples/with-preact/package.json similarity index 75% rename from examples/kitchen-sink/package.json rename to examples/with-preact/package.json index b1254eb7c7..0daf05f53f 100644 --- a/examples/kitchen-sink/package.json +++ b/examples/with-preact/package.json @@ -1,7 +1,7 @@ { - "name": "@astrojs/kitchen-sink-example", + "name": "@astrojs/with-preact-example", "private": true, - "version": "1.0.0", + "version": "0.0.1", "scripts": { "start": "astro dev", "build": "astro build" diff --git a/examples/with-preact/src/components/Counter.tsx b/examples/with-preact/src/components/Counter.tsx new file mode 100644 index 0000000000..7c520b1675 --- /dev/null +++ b/examples/with-preact/src/components/Counter.tsx @@ -0,0 +1,19 @@ +import { h, Fragment } from 'preact'; +import { useState } from 'preact/hooks'; + +export default function Counter({ children }) { + const [count, setCount] = useState(0); + const add = () => setCount((i) => i + 1); + const subtract = () => setCount((i) => i - 1); + + return ( + <> +
+ + 
{count}
+ +
+
{children}
+ + ); +} diff --git a/examples/with-preact/src/pages/index.astro b/examples/with-preact/src/pages/index.astro new file mode 100644 index 0000000000..66fa9e84b6 --- /dev/null +++ b/examples/with-preact/src/pages/index.astro @@ -0,0 +1,38 @@ +--- +import Counter from '../components/Counter.jsx' +--- + + + + + + + + +
+ +

Hello Preact!

+ +
+ + diff --git a/examples/with-react/.npmrc b/examples/with-react/.npmrc new file mode 100644 index 0000000000..0cc653b2c3 --- /dev/null +++ b/examples/with-react/.npmrc @@ -0,0 +1,2 @@ +## force pnpm to hoist +shamefully-hoist = true \ No newline at end of file diff --git a/examples/with-react/package.json b/examples/with-react/package.json new file mode 100644 index 0000000000..9c09d61549 --- /dev/null +++ b/examples/with-react/package.json @@ -0,0 +1,15 @@ +{ + "name": "@astrojs/with-react-example", + "private": true, + "version": "0.0.1", + "scripts": { + "start": "astro dev", + "build": "astro build" + }, + "devDependencies": { + "astro": "^0.15.0" + }, + "snowpack": { + "workspaceRoot": "../.." + } +} diff --git a/examples/with-react/src/components/Counter.jsx b/examples/with-react/src/components/Counter.jsx new file mode 100644 index 0000000000..488854fd37 --- /dev/null +++ b/examples/with-react/src/components/Counter.jsx @@ -0,0 +1,18 @@ +import React, { useState } from 'react' + +export default function Counter({ children }) { + const [count, setCount] = useState(0) + const add = () => setCount((i) => i + 1) + const subtract = () => setCount((i) => i - 1) + + return ( + <> +
+ + 
{count}
+ +
+
{children}
+ + ) +} diff --git a/examples/with-react/src/pages/index.astro b/examples/with-react/src/pages/index.astro new file mode 100644 index 0000000000..3bd650e022 --- /dev/null +++ b/examples/with-react/src/pages/index.astro @@ -0,0 +1,38 @@ +--- +import Counter from '../components/Counter.jsx' +--- + + + + + + + + +
+ +

Hello React!

+ +
+ + diff --git a/examples/with-svelte/.npmrc b/examples/with-svelte/.npmrc new file mode 100644 index 0000000000..0cc653b2c3 --- /dev/null +++ b/examples/with-svelte/.npmrc @@ -0,0 +1,2 @@ +## force pnpm to hoist +shamefully-hoist = true \ No newline at end of file diff --git a/examples/with-svelte/package.json b/examples/with-svelte/package.json new file mode 100644 index 0000000000..22220cb7c4 --- /dev/null +++ b/examples/with-svelte/package.json @@ -0,0 +1,15 @@ +{ + "name": "@astrojs/with-svelte-example", + "private": true, + "version": "0.0.1", + "scripts": { + "start": "astro dev", + "build": "astro build" + }, + "devDependencies": { + "astro": "^0.15.0" + }, + "snowpack": { + "workspaceRoot": "../.." + } +} diff --git a/examples/with-svelte/src/components/Counter.svelte b/examples/with-svelte/src/components/Counter.svelte new file mode 100644 index 0000000000..9aaf421c1a --- /dev/null +++ b/examples/with-svelte/src/components/Counter.svelte @@ -0,0 +1,20 @@ + + +
+ + 
{ count }
+ +
+
+ +
diff --git a/examples/with-svelte/src/pages/index.astro b/examples/with-svelte/src/pages/index.astro new file mode 100644 index 0000000000..5a0c1039d9 --- /dev/null +++ b/examples/with-svelte/src/pages/index.astro @@ -0,0 +1,38 @@ +--- +import Counter from '../components/Counter.svelte' +--- + + + + + + + + +
+ +

Hello Svelte!

+ +
+ + diff --git a/examples/with-vue/.npmrc b/examples/with-vue/.npmrc new file mode 100644 index 0000000000..0cc653b2c3 --- /dev/null +++ b/examples/with-vue/.npmrc @@ -0,0 +1,2 @@ +## force pnpm to hoist +shamefully-hoist = true \ No newline at end of file diff --git a/examples/with-vue/package.json b/examples/with-vue/package.json new file mode 100644 index 0000000000..a3d07b5731 --- /dev/null +++ b/examples/with-vue/package.json @@ -0,0 +1,15 @@ +{ + "name": "@astrojs/with-vue-example", + "private": true, + "version": "0.0.1", + "scripts": { + "start": "astro dev", + "build": "astro build" + }, + "devDependencies": { + "astro": "^0.15.0" + }, + "snowpack": { + "workspaceRoot": "../.." + } +} diff --git a/examples/with-vue/src/components/Counter.vue b/examples/with-vue/src/components/Counter.vue new file mode 100644 index 0000000000..8179fb1d90 --- /dev/null +++ b/examples/with-vue/src/components/Counter.vue @@ -0,0 +1,27 @@ + + + diff --git a/examples/with-vue/src/pages/index.astro b/examples/with-vue/src/pages/index.astro new file mode 100644 index 0000000000..949012d0f3 --- /dev/null +++ b/examples/with-vue/src/pages/index.astro @@ -0,0 +1,38 @@ +--- +import Counter from '../components/Counter.vue' +--- + + + + + + + + +
+ +

Hello Vue!

+ +
+ +