diff --git a/examples/snowpack/astro/components/Nav.hmx b/examples/snowpack/astro/components/Nav.hmx
index f0725d84b..d679553c6 100644
--- a/examples/snowpack/astro/components/Nav.hmx
+++ b/examples/snowpack/astro/components/Nav.hmx
@@ -1,6 +1,6 @@
-<script astro>
+---
   export let props: { version: string };
-</script>
+---
 
 <style lang="scss">
   @use '../../public/css/var' as *;
diff --git a/examples/snowpack/astro/components/NewsAssets.svelte b/examples/snowpack/astro/components/NewsAssets.svelte
index f53078e79..fc968ee99 100644
--- a/examples/snowpack/astro/components/NewsAssets.svelte
+++ b/examples/snowpack/astro/components/NewsAssets.svelte
@@ -1,7 +1,7 @@
-<script>
+---
 	//let name = 'world';
 	// TODO make this dynamic?
-</script>
+---
 
 <h3>Assets</h3>
 
diff --git a/examples/snowpack/astro/components/Subnav.hmx b/examples/snowpack/astro/components/Subnav.hmx
index 7d0e332ee..2c054a5fc 100644
--- a/examples/snowpack/astro/components/Subnav.hmx
+++ b/examples/snowpack/astro/components/Subnav.hmx
@@ -1,10 +1,10 @@
-<script astro>
+---
   export let props: {
     title: string,
     inputPath: string,
     headers: { text: string, slug: string }[]
   };
-</script>
+---
 
 <style lang="scss">
 @use "../../public/css/var" as *;
diff --git a/examples/snowpack/astro/layouts/base.hmx b/examples/snowpack/astro/layouts/base.hmx
index d773a07c1..1620a17b6 100644
--- a/examples/snowpack/astro/layouts/base.hmx
+++ b/examples/snowpack/astro/layouts/base.hmx
@@ -1,4 +1,4 @@
-<script astro>
+---
   import Banner from '../components/Banner.hmx';
   import Nav from '../components/Nav.hmx';
   export function setup({ context }) {
@@ -10,7 +10,7 @@
       }
     };
   }
-</script>
+---
 
 <astro:head>
   <meta charset="utf-8" />
diff --git a/examples/snowpack/astro/layouts/content-with-cover.hmx b/examples/snowpack/astro/layouts/content-with-cover.hmx
index 858a9d31e..34797f31f 100644
--- a/examples/snowpack/astro/layouts/content-with-cover.hmx
+++ b/examples/snowpack/astro/layouts/content-with-cover.hmx
@@ -1,4 +1,4 @@
-<script astro>
+---
   import Menu from '../components/Menu.hmx';
   import Subnav from '../components/Subnav.hmx';
 
@@ -6,7 +6,7 @@
   export function setup({ context }) {
     return {};
   }
-</script>
+---
 
 
 <style>
diff --git a/examples/snowpack/astro/layouts/content.hmx b/examples/snowpack/astro/layouts/content.hmx
index 921c76321..8995e049b 100644
--- a/examples/snowpack/astro/layouts/content.hmx
+++ b/examples/snowpack/astro/layouts/content.hmx
@@ -1,4 +1,4 @@
-<script astro>
+---
   import Subnav from '../components/Subnav.hmx';
   import Menu from '../components/Menu.hmx';
 
@@ -9,7 +9,7 @@
       }
     };
   }
-</script>
+---
 
 <div class="container">
   <section class="snow-view__docs has-subnav">
diff --git a/examples/snowpack/astro/layouts/main.hmx b/examples/snowpack/astro/layouts/main.hmx
index d66a96baf..27d6985e8 100644
--- a/examples/snowpack/astro/layouts/main.hmx
+++ b/examples/snowpack/astro/layouts/main.hmx
@@ -1,10 +1,10 @@
-<script astro>
+---
   import Menu from '../components/Menu.hmx';
   export const layout = 'layouts/base.hmx';
   export function setup({ context }) {
     return {};
   }
-</script>
+---
 
 <div class="container">
   <section class="snow-view__docs is-full">
diff --git a/examples/snowpack/astro/layouts/post.hmx b/examples/snowpack/astro/layouts/post.hmx
index e0b87afbf..2f857447b 100644
--- a/examples/snowpack/astro/layouts/post.hmx
+++ b/examples/snowpack/astro/layouts/post.hmx
@@ -1,10 +1,10 @@
-<script astro>
+---
   import { format as formatDate, parseISO } from 'date-fns';
   export const layout = 'layouts/base.hmx';
   export function setup({ context }) {
     return {};
   }
-</script>
+---
 
 <astro:head>
   <link rel="stylesheet" href="/css/legacy-post.css" />
diff --git a/examples/snowpack/astro/pages/404.hmx b/examples/snowpack/astro/pages/404.hmx
index f82e303ff..f26d1ac2b 100644
--- a/examples/snowpack/astro/pages/404.hmx
+++ b/examples/snowpack/astro/pages/404.hmx
@@ -1,4 +1,4 @@
-<script astro>
+---
   export const layout = 'layouts/main.hmx';
 
   export function setup({ context }) {
@@ -8,7 +8,7 @@
       }
     };
   }
-</script>
+---
 
 <h2 class="content-title">
   {context.title}
diff --git a/examples/snowpack/astro/pages/guides.hmx b/examples/snowpack/astro/pages/guides.hmx
index 0c56ce5a4..ae1829ea1 100644
--- a/examples/snowpack/astro/pages/guides.hmx
+++ b/examples/snowpack/astro/pages/guides.hmx
@@ -1,4 +1,4 @@
-<script astro>
+---
   import Card from '../components/Card.jsx';
 
   export const layout = 'layouts/main.hmx';
@@ -40,7 +40,7 @@
       }
     };
   }
-</script>
+---
 
 <h2 class="content-title">
   {context.title}
diff --git a/examples/snowpack/astro/pages/index.hmx b/examples/snowpack/astro/pages/index.hmx
index 7a27a30b0..0bd88e5a9 100644
--- a/examples/snowpack/astro/pages/index.hmx
+++ b/examples/snowpack/astro/pages/index.hmx
@@ -1,12 +1,12 @@
-<script astro>
-  import Menu from '../components/Menu.hmx';
-  import Hero from '../components/Hero.hmx';
+---
+  import MenuA from '../components/Menu.hmx';
+  import HeroB from '../components/Hero.hmx';
 
   export const layout = 'layouts/base.hmx';
   export function setup({ context }) {
     return {};
   }
-</script>
+---
 
 <astro:head>
   <meta charset="AAA" />
diff --git a/examples/snowpack/astro/pages/news.hmx b/examples/snowpack/astro/pages/news.hmx
index 3cdf8b06e..7bc012226 100644
--- a/examples/snowpack/astro/pages/news.hmx
+++ b/examples/snowpack/astro/pages/news.hmx
@@ -1,4 +1,4 @@
-<script astro>
+---
   import Card from '../components/Card.jsx';
   import CompanyLogo from '../components/CompanyLogo.jsx';
   import NewsAssets from '../components/NewsAssets.svelte';
@@ -23,7 +23,7 @@
       }
     }
   }
-</script>
+---
 
 <NewsTitle title={context.title} />
 
diff --git a/examples/snowpack/astro/pages/plugins.hmx b/examples/snowpack/astro/pages/plugins.hmx
index 33275b2f5..e016e0504 100644
--- a/examples/snowpack/astro/pages/plugins.hmx
+++ b/examples/snowpack/astro/pages/plugins.hmx
@@ -38,7 +38,7 @@
   }
 </style>
 
-<script astro>
+---
   import news from '../data/news.json';
   import users from '../data/users.json';
   import PluginSearchPage from '../components/PluginSearchPage.jsx';
@@ -54,7 +54,7 @@
       },
     };
   }
-</script>
+---
 
 <h2 class="content-title">{ context.title }</h2>
 
diff --git a/examples/snowpack/astro/pages/proof-of-concept-dynamic/[slug].hmx b/examples/snowpack/astro/pages/proof-of-concept-dynamic/[slug].hmx
index 55ea99f75..8ff8a446f 100644
--- a/examples/snowpack/astro/pages/proof-of-concept-dynamic/[slug].hmx
+++ b/examples/snowpack/astro/pages/proof-of-concept-dynamic/[slug].hmx
@@ -1,4 +1,4 @@
-<script astro>
+---
   import Subnav from '../components/Subnav.hmx';
     import { content as Menu } from '../components/Menu.hmx';
     // import contentful from 'skypack:contentful';
@@ -7,7 +7,7 @@
         const entry = await contentful.getEntry(params.slug);
         return { title: entry.fields.title, description: entry.fields.description, layout: 'layouts/base.hmx', props: { entry } };
     }
-</script>
+---
 
 <div class="container">
     <section class="snow-view__docs has-subnav">
diff --git a/src/compiler/parse/index.ts b/src/compiler/parse/index.ts
index f98119d73..00eccdb7d 100644
--- a/src/compiler/parse/index.ts
+++ b/src/compiler/parse/index.ts
@@ -226,7 +226,7 @@ export default function parse(template: string, options: ParserOptions = {}): As
     parser.error(
       {
         code: 'duplicate-style',
-        message: 'You can only have one top-level <style> tag per component',
+        message: 'You can only have one <style> tag per HMX file',
       },
       parser.css[1].start
     );
@@ -240,7 +240,7 @@ export default function parse(template: string, options: ParserOptions = {}): As
     parser.error(
       {
         code: 'invalid-script',
-        message: 'A component can only have one <script astro> element',
+        message: 'A component can only have one frontmatter (---) script',
       },
       hmx_scripts[1].start
     );
diff --git a/src/compiler/parse/state/fragment.ts b/src/compiler/parse/state/fragment.ts
index a62748ae0..eb72551c6 100644
--- a/src/compiler/parse/state/fragment.ts
+++ b/src/compiler/parse/state/fragment.ts
@@ -1,9 +1,14 @@
 import tag from './tag.js';
+import setup from './setup.js';
 import mustache from './mustache.js';
 import text from './text.js';
 import { Parser } from '../index.js';
 
 export default function fragment(parser: Parser) {
+  if (parser.match('---')) {
+    return setup;
+  }
+
   if (parser.match('<')) {
     return tag;
   }
diff --git a/src/compiler/parse/state/setup.ts b/src/compiler/parse/state/setup.ts
new file mode 100644
index 000000000..45c251f51
--- /dev/null
+++ b/src/compiler/parse/state/setup.ts
@@ -0,0 +1,30 @@
+// @ts-nocheck
+
+import { Parser } from '../index.js';
+
+export default function setup(parser: Parser): void {
+  const start = parser.index;
+  parser.index += 3;
+  const content_start = parser.index;
+  const setupScriptContent = parser.read_until(/^---/m);
+  const content_end = parser.index;
+console.log(setupScriptContent);
+  parser.eat('---', true);
+  const end = parser.index;
+
+  console.log('XXX', parser.template.slice(end));
+  parser.js.push({
+    type: 'Script',
+    context: 'setup',
+    start,
+    end,
+    content: setupScriptContent,
+    // attributes,
+    // content: {
+    //   start: content_start,
+    //   end: content_end,
+    //   styles,
+    // },
+  });
+  return;
+}
diff --git a/src/compiler/parse/state/tag.ts b/src/compiler/parse/state/tag.ts
index 8ce297bfd..c6684874c 100644
--- a/src/compiler/parse/state/tag.ts
+++ b/src/compiler/parse/state/tag.ts
@@ -24,13 +24,14 @@ const meta_tags = new Map([
 const valid_meta_tags = Array.from(meta_tags.keys()); //.concat('astro:self', 'astro:component', 'astro:fragment');
 
 const specials = new Map([
-  [
-    'script',
-    {
-      read: read_script,
-      property: 'js',
-    },
-  ],
+  // Now handled as "setup" in setup.ts
+  // [
+  //   'script',
+  //   {
+  //     read: read_script,
+  //     property: 'js',
+  //   },
+  // ],
   [
     'style',
     {
diff --git a/src/compiler/parse/state/text.ts b/src/compiler/parse/state/text.ts
index d472a46b2..cca83f2d4 100644
--- a/src/compiler/parse/state/text.ts
+++ b/src/compiler/parse/state/text.ts
@@ -8,7 +8,7 @@ export default function text(parser: Parser) {
 
   let data = '';
 
-  while (parser.index < parser.template.length && !parser.match('<') && !parser.match('{')) {
+  while (parser.index < parser.template.length && !parser.match('---') && !parser.match('<') && !parser.match('{')) {
     data += parser.template[parser.index++];
   }
 
diff --git a/test/fixtures/hmx-basic/astro/pages/index.hmx b/test/fixtures/hmx-basic/astro/pages/index.hmx
index 19f888e04..d4f6fc5a1 100644
--- a/test/fixtures/hmx-basic/astro/pages/index.hmx
+++ b/test/fixtures/hmx-basic/astro/pages/index.hmx
@@ -1,10 +1,10 @@
-<script astro>
+---
   export function setup() {
     return {
       props: {}
     }
   }
-</script>
+---
 
 <astro:head>
   <!-- Head Stuff -->
diff --git a/test/fixtures/hmx-markdown/astro/pages/index.hmx b/test/fixtures/hmx-markdown/astro/pages/index.hmx
index 19f888e04..d4f6fc5a1 100644
--- a/test/fixtures/hmx-markdown/astro/pages/index.hmx
+++ b/test/fixtures/hmx-markdown/astro/pages/index.hmx
@@ -1,10 +1,10 @@
-<script astro>
+---
   export function setup() {
     return {
       props: {}
     }
   }
-</script>
+---
 
 <astro:head>
   <!-- Head Stuff -->
diff --git a/test/fixtures/react-component/astro/pages/index.hmx b/test/fixtures/react-component/astro/pages/index.hmx
index 8616754ca..5debf6380 100644
--- a/test/fixtures/react-component/astro/pages/index.hmx
+++ b/test/fixtures/react-component/astro/pages/index.hmx
@@ -1,6 +1,6 @@
-<script astro>
+---
   import Hello from '../components/Hello.jsx';
-</script>
+---
 
 <astro:head>
   <!-- Head Stuff -->