docs: Update examples to use moon-configs. (#1070)

* Update docs. * Update blog.
moonrepo · Sep 25, 2023 · 89ff758 · 89ff758
1 parent 08d13cd
commit 89ff758
Show file tree

Hide file tree

Showing 8 changed files with 81 additions and 262 deletions.
diff --git a/website/blog/2023-09-25_moon-v1.14.mdx b/website/blog/2023-09-25_moon-v1.14.mdx
@@ -125,6 +125,8 @@ Learn more about how this works under the hood in the
 View the [official release](https://github.com/moonrepo/moon/releases/tag/v1.14.0) for a full list
 of changes.
 
+- Added `packemon`, `sveltekit`, `vite`, `vitest` to
+  [moonrepo/moon-configs](https://github.com/moonrepo/moon-configs).
 - Updated `.moon/tasks` to support nested folders, for better organization of task files.
 - Improved handling of certificates and proxies.
 - Updated to proto v0.18.
diff --git a/website/docs/guides/examples/astro.mdx b/website/docs/guides/examples/astro.mdx
@@ -23,49 +23,21 @@ cd apps && npm create astro@latest
 Since Astro is per-project, the associated moon tasks should be defined in each project's
 [`moon.yml`](../../config/project) file.
 
-```yaml title="<project>/moon.yml"
-fileGroups:
-	astro:
-		- 'public/**/*'
-		- 'src/**/*'
-		- 'astro.config.*'
+:::tip
 
-tasks:
-	astro:
-		command: 'astro'
-		local: true
-
-	# Development server
-	dev:
-		command: 'astro dev'
-		local: true
-
-	# Production build
-	build:
-		command: 'astro build'
-		inputs:
-			- '@group(astro)'
-		outputs:
-			- 'dist'
-
-	# Check .astro files
-	check:
-		command: 'astro check'
-		inputs:
-			- '@group(astro)'
-		deps:
-			- '~:typecheck'
-
-	# Preview production build locally
-	preview:
-		command: 'astro preview'
-		deps:
-			- '~:build'
-		local: true
+We suggest inheriting Astro tasks from the
+[official moon configuration preset](https://github.com/moonrepo/moon-configs/tree/master/javascript/astro).
+
+:::
+
+```yaml title="<project>/moon.yml"
+# Inherit tasks from the `astro` preset
+# https://github.com/moonrepo/moon-configs
+tags: ['astro']
 
 # Disable project references
 toolchain:
-	typescript:
+  typescript:
     syncProjectReferences: false
 ```
 

diff --git a/website/docs/guides/examples/nest.mdx b/website/docs/guides/examples/nest.mdx
@@ -1,6 +1,6 @@
 ---
-title: NestJS example
-sidebar_label: NestJS
+title: Nest example
+sidebar_label: Nest
 ---
 
 import AddDepsTabs from '@site/src/components/AddDepsTabs';

diff --git a/website/docs/guides/examples/next.mdx b/website/docs/guides/examples/next.mdx
@@ -1,6 +1,6 @@
 ---
-title: Next.js example
-sidebar_label: Next.js
+title: Next example
+sidebar_label: Next
 ---
 
 import AddDepsTabs from '@site/src/components/AddDepsTabs';
@@ -28,42 +28,17 @@ cd apps && npx create-next-app <project> --typescript
 Since Next.js is per-project, the associated moon tasks should be defined in each project's
 [`moon.yml`](../../config/project) file.
 
-```yaml title="<project>/moon.yml"
-fileGroups:
-	next:
-		- 'pages/**/*'
-		- 'public/**/*'
-		- 'src/**/*'
-		- 'next-env.d.ts'
-		- 'next.config.*'
+:::tip
 
-tasks:
-	# Development server
-	dev:
-		command: 'next dev'
-		local: true
-
-	# Production build (SSR)
-	build:
-		command: 'next build'
-		inputs:
-			- '@group(next)'
+We suggest inheriting Next.js tasks from the
+[official moon configuration preset](https://github.com/moonrepo/moon-configs/tree/master/javascript/next).
 
-	# Production build (SSG)
-	export:
-		command: 'next export -o ./build'
-		deps:
-			- '~:build'
-		inputs:
-			- '@group(next)'
-		outputs:
-			- '.next'
-			- 'build'
-
-	# Serve the build
-	start:
-		command: 'next start'
-		local: true
+:::
+
+```yaml title="<project>/moon.yml"
+# Inherit tasks from the `next` preset
+# https://github.com/moonrepo/moon-configs
+tags: ['next']
 ```
 
 ### ESLint integration

diff --git a/website/docs/guides/examples/packemon.mdx b/website/docs/guides/examples/packemon.mdx
@@ -26,85 +26,27 @@ repository.
 
 ## Setup
 
-Package building does not apply to every project, only packages, so where you place the build task
-is up to you. The following patterns are suggested:
-
-- A `build` task in [`.moon/tasks/node-library.yml`](../../config/tasks), which will be inherited by
-  package based projects.
-- A `build` task in [`moon.yml`](../../config/project) for each project.
-
-<Tabs
-  groupId="config-type"
-  defaultValue="global"
-  values={[
-    { label: 'Globally inherited', value: 'global' },
-    { label: 'Per project', value: 'local' },
-  ]}
->
-<TabItem value="global">
-
-```yaml title=".moon/tasks/node-library.yml"
-build:
-	command:
-		- 'packemon'
-		- 'pack'
-		# Add `engines` field to package
-		- '--addEngines'
-		# Add `exports` field to package
-		- '--addExports'
-		# Generate TypeScript declarations
-		- '--declaration'
-	inputs:
-		# Source files only
-		- 'src/**/*'
-		- 'package.json'
-		# A build specific tsconfig
-		- 'tsconfig.*.json'
-		- '/tsconfig.options.json'
-	outputs:
-		# Compiled files: lib, esm, cjs, mjs, etc
-		- 'lib'
-```
+Since Packemon is per-project, the associated moon tasks should be defined in each project's
+[`moon.yml`](../../config/project) file.
 
-Depending on your Packemon configuration, you may need to change the task outputs per project like
-so:
+:::tip
 
-```yaml title="<package>/moon.yml"
-# Define additional compiled files unique to this project
-tasks:
-	build:
-		outputs:
-			- 'cjs'
-```
+We suggest inheriting Packemon tasks from the
+[official moon configuration preset](https://github.com/moonrepo/moon-configs/tree/master/javascript/packemon).
 
-</TabItem>
-<TabItem value="local">
-
-```yaml title="<package>/moon.yml"
-build:
-	command:
-		- 'packemon'
-		- 'pack'
-		# Add `engines` field to package
-		- '--addEngines'
-		# Add `exports` field to package
-		- '--addExports'
-		# Generate TypeScript declarations
-		- '--declaration'
-	inputs:
-		# Source files only
-		- 'src/**/*'
-		- 'package.json'
-		# A build specific tsconfig
-		- 'tsconfig.*.json'
-		- '/tsconfig.options.json'
-	outputs:
-		# Compiled files: lib, esm, cjs, mjs, etc
-		- 'lib'
-```
+:::
 
-</TabItem>
-</Tabs>
+```yaml title="<project>/moon.yml"
+# Inherit tasks from the `packemon` preset
+# https://github.com/moonrepo/moon-configs
+tags: ['packemon']
+
+# Set the output formats
+tasks:
+  build:
+    outputs:
+      - 'cjs'
+```
 
 ### TypeScript integration
 

diff --git a/website/docs/guides/examples/remix.mdx b/website/docs/guides/examples/remix.mdx
@@ -30,35 +30,17 @@ root via package workspaces!
 Since Remix is per-project, the associated moon tasks should be defined in each project's
 [`moon.yml`](../../config/project) file.
 
+:::tip
+
+We suggest inheriting Remix tasks from the
+[official moon configuration preset](https://github.com/moonrepo/moon-configs/tree/master/javascript/remix).
+
+:::
+
 ```yaml title="<project>/moon.yml"
-fileGroups:
-	remix:
-		- 'app/**/*'
-		- 'public/**/*'
-		- 'remix.env.d.ts'
-		- 'remix.config.*'
-
-tasks:
-	# Development server
-	dev:
-		command: 'remix dev'
-		local: true
-
-	# Production build
-	build:
-		command: 'remix build'
-		inputs:
-			- '@group(remix)'
-		outputs:
-			- '.cache'
-			- 'build'
-
-	# Serve the build
-	start:
-		command: 'remix-serve ./build'
-		deps:
-			- '~:build'
-		local: true
+# Inherit tasks from the `remix` preset
+# https://github.com/moonrepo/moon-configs
+tags: ['remix']
 ```
 
 ### ESLint integration

diff --git a/website/docs/guides/examples/sveltekit.mdx b/website/docs/guides/examples/sveltekit.mdx
@@ -28,47 +28,19 @@ and Vitest among other options. moon supports and has guides for many of these t
 ## Setup
 
 Since SvelteKit is per-project, the associated moon tasks should be defined in each project's
-moon.yml file.
+[`moon.yml`](../../config/project) file.
 
-```yaml title="<project>/moon.yml"
-type: 'application'
-language: 'typescript'
-
-fileGroups:
-  svelte:
-    - 'src/**/*'
-    - 'static/**/*'
-    - 'svelte.config.*'
-    - 'vite.config.*'
-
-tasks:
-  dev:
-    command: 'vite dev'
-    local: true
-
-  build:
-    command: 'vite build'
-    inputs:
-      - '@group(svelte)'
-    outputs:
-      - '.svelte-kit'
-
-  preview:
-    command: 'vite preview'
-    local: true
-    deps:
-      - 'build'
+:::tip
 
-  test:
-    command: 'vitest'
-    inputs:
-      - '@group(svelte)'
-```
+We suggest inheriting SvelteKit tasks from the
+[official moon configuration preset](https://github.com/moonrepo/moon-configs/tree/master/javascript/sveltekit).
 
-To run the SvelteKit dev server:
+:::
 
-```shell
-moon run <project>:dev
+```yaml title="<project>/moon.yml"
+# Inherit tasks from the `sveltekit` preset
+# https://github.com/moonrepo/moon-configs
+tags: ['sveltekit']
 ```
 
 ### ESLint integration
@@ -112,16 +84,21 @@ typechecking works. From here we suggest utilizing a [global `typecheck` task](.
 consistency across all projects within the repository. However, because Svelte isn't standard
 JavaScript, it requires the use of the `svelte-check` command for type-checking.
 
+:::info
+
+The
+[moon configuration preset](https://github.com/moonrepo/moon-configs/tree/master/javascript/sveltekit)
+provides the `check` task below.
+
+:::
+
 ```yaml title="<project>/moon.yml"
 workspace:
   inheritedTasks:
     exclude: ['typecheck']
 
 tasks:
-  typecheck-sync:
-    command: 'svelte-kit sync'
-
-  typecheck:
+  check:
     command: 'svelte-check --tsconfig ./tsconfig.json'
     deps:
       - 'typecheck-sync'