feat(build): upgrade to Astro 7 and Tailwind CSS 4

.claude/launch.json

@@ -0,0 +1,11 @@
+{
+  "version": "0.0.1",
+  "configurations": [
+    {
+      "name": "docs-dev",
+      "runtimeExecutable": "npm",
+      "runtimeArgs": ["run", "dev"],
+      "port": 4321
+    }
+  ]
+}

.github/workflows/azion-deploy.yml

@@ -0,0 +1,74 @@
+name: Deploy Application using Azion CLI
+
+on:
+  workflow_dispatch:
+    inputs:
+      branch:
+        required: true
+        type: choice
+        default: main
+        options:
+          - main
+
+jobs:
+  deploy:
+    name: Deploy
+    runs-on: ubuntu-latest
+
+    permissions:
+      contents: write
+
+    steps:
+      - name: Checkout
+        uses: actions/checkout@v4
+        with:
+          fetch-depth: 0
+
+      - name: Use Node.js 20.x
+        uses: actions/setup-node@v4
+        with:
+          node-version: 20
+
+	  # If you want to change package manager, change the command below and add the necessary configurations
+      - name: Install dependencies
+        run: npm install
+
+      - name: Install Azion CLI
+        run: |
+          curl -o azionlinux https://downloads.azion.com/linux/x86_64/azion
+          sudo mv azionlinux /usr/bin/azion
+          sudo chmod u+x /usr/bin/azion
+
+      - name: CLI version
+        run: azion --version
+
+		# Configure a personal token in your github secrets
+		# You may create a personal token by running 'azion create personal-token'
+      - name: Configure token
+        run: |
+          azion -t ${{ secrets.AZION_PERSONAL_TOKEN }}  
+          azion whoami
+
+      - name: Azion Build
+        run: |
+          azion build
+
+      # You may add the --sync flag to sync local and remote resources
+      - name: Azion Deploy
+        run: |
+          azion deploy --local --debug
+
+      - name: Commit Azion files
+        run: |
+          git config user.name "github-actions[bot]"
+          git config user.email "41898282+github-actions[bot]@users.noreply.github.com"
+          git add azion/azion.json azion.config.* || true
+          # Commit only if there are staged changes
+          if git diff --cached --quiet; then
+            echo "No Azion changes to commit. Skipping push."
+          else
+            git commit -m "chore: update azion files"
+            # Rebase in case remote has new commits, then push
+            git pull --rebase origin ${{ inputs.branch }}
+            git push
+          fi

.gitignore

@@ -39,3 +39,7 @@ sandbox.config.json
 .kilocode
 .kilo
 .markdown-link-resolver/
+#Paths added by Azion CLI
+.edge/
+.vulcan
+.open-next

astro.config.ts

@@ -1,8 +1,10 @@
 import { SITE_URL } from './src/consts';
+import type { AstroUserConfig } from 'astro';
 import { defineConfig } from 'astro/config';
+import { unified } from '@astrojs/markdown-remark';
+import tailwindcss from '@tailwindcss/vite';
 
 import mdx from '@astrojs/mdx';
-import tailwind from '@astrojs/tailwind';
 import vue from '@astrojs/vue';
 import preact from '@astrojs/preact';
 import AutoImport from 'astro-auto-import';
@@ -12,7 +14,7 @@ import rehypeAutolinkHeadings from 'rehype-autolink-headings';
 import remarkSmartypants from 'remark-smartypants';
 
 import { asideAutoImport, astroAsides } from './integrations/astro-asides';
-import AzionExpressiveCode from './integrations/expressive-code';
+import { astroCodeBlocks, codeBlockAutoImport } from './integrations/astro-code-blocks';
 
 import { sitemap } from './integrations/sitemap';
 import { autoLinks } from './plugins/rehype-autolink-config';
@@ -23,6 +25,8 @@ import { rehypeOptimizeStatic } from './plugins/rehype-optimize-static';
 import { rehypeTasklistEnhancer } from './plugins/rehype-tasklist-enhancer';
 import rehypeScrollableTables from './plugins/rehype-scrollable-tables.js'
 
+type MarkdownConfig = NonNullable<AstroUserConfig['markdown']>;
+
 const productionBuild = import.meta.env.PROD;
 
 export default defineConfig({
@@ -33,23 +37,34 @@ export default defineConfig({
 	},
 	integrations: [
 		AutoImport({
-			imports: [asideAutoImport, { '~/components/Video.astro': [['default', 'Video']] }],
+			imports: [
+				asideAutoImport,
+				codeBlockAutoImport,
+				{ '~/components/Video.astro': [['default', 'Video']] },
+			],
 		}),
 		preact({ compat: true }),
 		sitemap(),
 		astroAsides(),
-		AzionExpressiveCode(),
+		astroCodeBlocks(),
 		mdx(),
-		tailwind({ applyBaseStyles: false }),
-		vue({ appEntrypoint: '/src/vue.config.js' })
+		// No appEntrypoint: the only global Vue plugin was vue-instantsearch,
+		// gone with the Algolia dialog (the palette talks to Algolia directly).
+		vue()
 	],
 	markdown: {
+		// Astro 7 defaults to the Sätteri (Rust) markdown pipeline, which does not
+		// run remark/rehype plugins. Keep the unified() processor until the custom
+		// plugins below are ported to Sätteri (planned as a follow-up).
+		processor: unified() as unknown as MarkdownConfig['processor'],
 		// Override with our own config
 		smartypants: false,
+		// The plugins below were written against unified 10 typings; they run
+		// fine on the unified() processor but Astro 7's plugin types reject them.
 		remarkPlugins: [
 			[remarkSmartypants, { dashes: false }],
 			// Add our custom plugin that marks links to fallback language pages
-		],
+		] as MarkdownConfig['remarkPlugins'],
 		rehypePlugins: [
 			rehypeSlug,
 			rehypeScrollableTables,
@@ -62,18 +77,40 @@ export default defineConfig({
 			rehypei18nAutolinkHeadings(),
 			// Collapse static parts of the hast to html
 			rehypeOptimizeStatic,
-		]
+		] as MarkdownConfig['rehypePlugins'],
 	},
 	compressHTML: productionBuild ? true : false,
 	trailingSlash: 'always', // for server
 	vite: {
-		ssrBuild: true,
 		server: {
       fs: {
         allow: ['..']
       }
     },
 	plugins: [
+		tailwindcss(),
+		{
+			// Astro 7 renders static pages in a dedicated `prerender` Vite
+			// environment that does not inherit the legacy `ssr.noExternal`
+			// list (and Astro overwrites `environments.prerender` wholesale in
+			// its build config).
+			name: 'azion:server-noexternal',
+			configEnvironment(name: string) {
+				if (name === 'client') return null;
+				return {
+					resolve: {
+						// `@aziontech/webkit` has to be bundled, not externalised:
+						// its `navigation-menu` entry is an `index.js` that imports
+						// `.vue` files, and Node cannot load those on its own
+						// ("Unknown file extension .vue"). Components whose entry is
+						// itself a `.vue` or a `.ts` happen to work either way, which
+						// is why this only surfaced when NavigationMenu was adopted.
+						noExternal: ['@astrojs/vue', '@aziontech/theme', '@aziontech/webkit'],
+						external: ['vue']
+					}
+				};
+			}
+		},
 		cssnano({
 			preset: [
 			'default', {
@@ -84,11 +121,11 @@ export default defineConfig({
 		})
 	],
 	ssr: {
-      noExternal: ['@astrojs/vue', 'azion-webkit', 'azion-theme'],
+      noExternal: ['@astrojs/vue', '@aziontech/theme', '@aziontech/webkit'],
       external: ['vue']
     },
 		optimizeDeps: {
-			include: ['vue', 'primevue/config']
+			include: ['vue']
 		}
 	}
 });