Pre-release refactors (#289)

* refactor: expose `astro/components` as component entrypoint

* refactor: remove `extensions` from all configs

* test: fix snowpack tests

* docs: update config doc

docs/config.md

@@ -4,34 +4,24 @@ To configure Astro, add an `astro.config.mjs` file in the root of your project.
 
 ```js
 export default {
-  /** Where to resolve all URLs relative to. Useful if you have a monorepo project. */
-  projectRoot: '.',
-  /** Path to your site’s pages (routes) */
-  pages: './src/pages',
-  /** When running `astro build`, path to final static output */
-  dist: './dist',
-  /** A folder of static files Astro will copy to the root. Useful for favicons, images, and other files that don’t need processing. */
-  public: './public',
-  /** Extension-specific handlings */
-  extensions: {
-    /** Set this to "preact" or "react" to determine what *.jsx files should load */
-    '.jsx': 'react',
-  },
-  /** Options specific to `astro build` */
+  projectRoot: '.',         // Where to resolve all URLs relative to. Useful if you have a monorepo project.
+  pages: './src/pages',     // Path to Astro components, pages, and data
+  dist: './dist',           // When running `astro build`, path to final static output
+  public: './public',       // A folder of static files Astro will copy to the root. Useful for favicons, images, and other files that don’t need processing.
   buildOptions: {
-    /** Your public domain, e.g.: https://my-site.dev/. Used to generate sitemaps and canonical URLs. */
-    site: '',
-    /** Generate sitemap (set to "false" to disable) */
-    sitemap: true,
+    // site: '',            // Your public domain, e.g.: https://my-site.dev/. Used to generate sitemaps and canonical URLs.
+    sitemap: true,          // Generate sitemap (set to "false" to disable)
   },
-  /** Options for the development server run with `astro dev`. */
   devOptions: {
-    /** The port to run the dev server on. */
-    port: 3000,
-    /** Path to tailwind.config.js if used, e.g. './tailwind.config.js' */
-    tailwindConfig: undefined,
+    port: 3000,             // The port to run the dev server on.
+    // tailwindConfig: '',  // Path to tailwind.config.js if used, e.g. './tailwind.config.js'
   },
-  /** default array of rendering packages inserted into runtime */
-  renderers: ['@astrojs/renderer-preact', '@astrojs/renderer-react', '@astrojs/renderer-svelte', '@astrojs/renderer-vue'],
+  // component renderers which are enabled by default
+  renderers: [
+    '@astrojs/renderer-svelte',
+    '@astrojs/renderer-vue',
+    '@astrojs/renderer-react',
+    '@astrojs/renderer-preact'
+  ],
 };
 ```

docs/markdown.md

@@ -58,7 +58,7 @@ Astro exposes a special `Markdown` component for `.astro` files which enables ma
 ---
 // For now, this import _must_ be named "Markdown" and _must not_ be wrapped with a custom component
 // We're working on easing these restrictions!
-import Markdown from 'astro/components/Markdown.astro';
+import { Markdown } from 'astro/components';
 import Layout from '../layouts/main.astro';
 import MyFancyCodePreview from '../components/MyFancyCodePreview.tsx';
 
@@ -101,7 +101,7 @@ If you have Markdown in a remote source, you may pass it directly to the Markdow
 
 ```jsx
 ---
-import Markdown from 'astro/components/Markdown.astro';
+import { Markdown } from 'astro/components';
 
 const content = await fetch('https://raw.githubusercontent.com/snowpackjs/snowpack/main/README.md').then(res => res.text());
 ---
@@ -115,7 +115,7 @@ Some times you might want to combine dynamic markdown with static markdown. You
 
 ```jsx
 ---
-import Markdown from 'astro/components/Markdown.astro';
+import { Markdown } from 'astro/components';
 
 const content = await fetch('https://raw.githubusercontent.com/snowpackjs/snowpack/main/README.md').then(res => res.text());
 ---

examples/astro-markdown/src/pages/index.astro

@@ -1,5 +1,5 @@
 ---
-import Markdown from 'astro/components/Markdown.astro';
+import { Markdown } from 'astro/components';
 import Layout from '../layouts/main.astro';
 import ReactCounter from '../components/ReactCounter.jsx';
 import PreactCounter from '../components/PreactCounter.tsx';

examples/doc/astro.config.mjs

@@ -1,5 +1,5 @@
 export default {
-  extensions: {
-    '.tsx': 'preact'
-  }
+  renderers: [
+    '@astrojs/renderer-preact'
+  ]
 };

examples/doc/src/pages/index.astro

@@ -1,5 +1,5 @@
 ---
-import Markdown from 'astro/components/Markdown.astro';
+import { Markdown } from 'astro/components';
 import Layout from '../layouts/Main.astro';
 ---
 

examples/portfolio/astro.config.mjs

@@ -1,5 +1,5 @@
 export default {
-  extensions: {
-    '.jsx': 'preact',
-  },
+  renderers: [
+    '@astrojs/renderer-preact'
+  ]
 };

examples/snowpack/astro.config.mjs

@@ -3,14 +3,9 @@ export default {
   pages: './src/pages',
   dist: './dist',
   public: './public',
-  extensions: {
-    '.jsx': 'preact',
-  },
-  snowpack: {
-    optimize: {
-      bundle: false,
-      minify: true,
-      target: 'es2018',
-    },
-  },
+  renderers: [
+    '@astrojs/renderer-vue',
+    '@astrojs/renderer-svelte',
+    '@astrojs/renderer-preact'
+  ]
 };

packages/astro/components/index.js

@@ -0,0 +1,2 @@
+export { default as Markdown } from './Markdown.astro';
+export { default as Prism } from './Prism.astro';

packages/astro/package.json

@@ -9,6 +9,7 @@
     ".": "./astro.mjs",
     "./package.json": "./package.json",
     "./snowpack-plugin": "./snowpack-plugin.cjs",
+    "./components": "./components/index.js",
     "./components/*": "./components/*",
     "./runtime/svelte": "./dist/frontend/runtime/svelte.js",
     "./dist/frontend/markdown.js": "./dist/frontend/markdown.js"

packages/astro/src/frontend/500.astro

@@ -1,5 +1,5 @@
 ---
-import Prism from 'astro/components/Prism.astro';
+import { Prism } from 'astro/components';
 let title = 'Uh oh...';
 
 const error = Astro.request.url.searchParams.get('error');

packages/astro/test/fixtures/astro-expr/astro.config.mjs

@@ -1,6 +1,5 @@
-
 export default {
-  extensions: {
-    '.jsx': 'preact'
-  }
-}
+  renderers: [
+    '@astrojs/renderer-preact'
+  ]
+}

packages/astro/test/fixtures/astro-fallback/astro.config.mjs

@@ -1,5 +1,5 @@
 export default {
-  extensions: {
-    '.jsx': 'preact',
-  },
-};
+  renderers: [
+    '@astrojs/renderer-preact'
+  ]
+}

packages/astro/test/fixtures/astro-markdown/src/pages/code.astro

@@ -1,5 +1,5 @@
 ---
-import Markdown from 'astro/components/Markdown.astro';
+import { Markdown } from 'astro/components';
 export const title = 'My Blog Post';
 export const description = 'This is a post about some stuff.';
 ---

packages/astro/test/fixtures/astro-markdown/src/pages/complex.astro

@@ -1,5 +1,5 @@
 ---
-import Markdown from 'astro/components/Markdown.astro';
+import { Markdown } from 'astro/components';
 import Layout from '../layouts/content.astro';
 import Hello from '../components/Hello.jsx';
 import Counter from '../components/Counter.jsx';

packages/astro/test/fixtures/astro-markdown/src/pages/external.astro

@@ -1,5 +1,5 @@
 ---
-import Markdown from 'astro/components/Markdown.astro';
+import { Markdown } from 'astro/components';
 import Hello from '../components/Hello.jsx';
 
 const outer = `# Outer`;
@@ -12,4 +12,4 @@ const inner = `## Inner`;
   # Nested
 
   <Markdown content={inner} />
-</Markdown>
+</Markdown>

packages/astro/test/fixtures/astro-markdown/src/pages/post.astro

@@ -1,5 +1,5 @@
 ---
-import Markdown from 'astro/components/Markdown.astro';
+import { Markdown } from 'astro/components';
 import Layout from '../layouts/content.astro';
 import Example from '../components/Example.jsx';