Merge remote-tracking branch 'upstream/main'
This commit is contained in:
Chris
commit
f34dcc9d16
192 changed files with 1712 additions and 799 deletions
5
.changeset/calm-houses-carry.md
Normal file
5
.changeset/calm-houses-carry.md
Normal file
|
|
@ -0,0 +1,5 @@
|
|||
---
|
||||
"astro": patch
|
||||
---
|
||||
|
||||
fix(astro): add support for `src/content/config.mts` files
|
||||
|
|
@ -1,5 +0,0 @@
|
|||
---
|
||||
'astro': patch
|
||||
---
|
||||
|
||||
Fixed a case where dynamic imports tried to preload inlined stylesheets.
|
||||
|
|
@ -1,5 +0,0 @@
|
|||
---
|
||||
'astro': patch
|
||||
---
|
||||
|
||||
Fixes remote assets caching logic to not use expired assets
|
||||
|
|
@ -1,5 +0,0 @@
|
|||
---
|
||||
'@astrojs/svelte': patch
|
||||
---
|
||||
|
||||
Removed vite warnings.
|
||||
|
|
@ -1,6 +0,0 @@
|
|||
---
|
||||
'create-astro': patch
|
||||
'astro': patch
|
||||
---
|
||||
|
||||
Support detecting Bun when logging messages with package manager information.
|
||||
5
.changeset/gold-weeks-hammer.md
Normal file
5
.changeset/gold-weeks-hammer.md
Normal file
|
|
@ -0,0 +1,5 @@
|
|||
---
|
||||
'astro': patch
|
||||
---
|
||||
|
||||
Minify the HTML of the redicts emitted during the build.
|
||||
5
.changeset/gorgeous-dancers-divide.md
Normal file
5
.changeset/gorgeous-dancers-divide.md
Normal file
|
|
@ -0,0 +1,5 @@
|
|||
---
|
||||
'astro': patch
|
||||
---
|
||||
|
||||
Do not add type="text/css" to inline style tag
|
||||
5
.changeset/grumpy-hotels-heal.md
Normal file
5
.changeset/grumpy-hotels-heal.md
Normal file
|
|
@ -0,0 +1,5 @@
|
|||
---
|
||||
'astro': patch
|
||||
---
|
||||
|
||||
Prevent client:only styles from being removed in dev (View Transitions)
|
||||
|
|
@ -1,5 +0,0 @@
|
|||
---
|
||||
'astro': patch
|
||||
---
|
||||
|
||||
Fix missing type for `imageConfig` export from `astro:assets`
|
||||
5
.changeset/itchy-clouds-design.md
Normal file
5
.changeset/itchy-clouds-design.md
Normal file
|
|
@ -0,0 +1,5 @@
|
|||
---
|
||||
'astro': patch
|
||||
---
|
||||
|
||||
chore: correct description of `attribute` option in `scopedStyleStrategy`
|
||||
|
|
@ -1,5 +0,0 @@
|
|||
---
|
||||
'@astrojs/vercel': patch
|
||||
---
|
||||
|
||||
Fix serverless function naming conflicts for routes with identical filenames but different directory structures
|
||||
5
.changeset/poor-pears-wash.md
Normal file
5
.changeset/poor-pears-wash.md
Normal file
|
|
@ -0,0 +1,5 @@
|
|||
---
|
||||
'astro': patch
|
||||
---
|
||||
|
||||
Fix lang unspecified code blocks (markdownlint MD040)
|
||||
5
.changeset/smart-dragons-taste.md
Normal file
5
.changeset/smart-dragons-taste.md
Normal file
|
|
@ -0,0 +1,5 @@
|
|||
---
|
||||
'@astrojs/cloudflare': minor
|
||||
---
|
||||
|
||||
Add support for Cloudflare Runtime (env vars, caches and req object), using `astro dev`
|
||||
|
|
@ -1,5 +0,0 @@
|
|||
---
|
||||
'@astrojs/mdx': patch
|
||||
---
|
||||
|
||||
Add location data to MDX compile errors
|
||||
5
.changeset/spotty-tools-rhyme.md
Normal file
5
.changeset/spotty-tools-rhyme.md
Normal file
|
|
@ -0,0 +1,5 @@
|
|||
---
|
||||
'astro': patch
|
||||
---
|
||||
|
||||
fix(types): make `image.service` optional
|
||||
|
|
@ -1,5 +0,0 @@
|
|||
---
|
||||
'astro': patch
|
||||
---
|
||||
|
||||
Fix markdown page HMR
|
||||
|
|
@ -1,5 +0,0 @@
|
|||
---
|
||||
'astro': patch
|
||||
---
|
||||
|
||||
Fix scroll position when navigating back from page w/o ViewTransitions
|
||||
5
.changeset/witty-readers-behave.md
Normal file
5
.changeset/witty-readers-behave.md
Normal file
|
|
@ -0,0 +1,5 @@
|
|||
---
|
||||
'astro': patch
|
||||
---
|
||||
|
||||
Bugfixes for back navigation in the view transition client-side router
|
||||
2
.github/workflows/ci.yml
vendored
2
.github/workflows/ci.yml
vendored
|
|
@ -108,7 +108,7 @@ jobs:
|
|||
strategy:
|
||||
matrix:
|
||||
OS: [ubuntu-latest]
|
||||
NODE_VERSION: [18, 20]
|
||||
NODE_VERSION: [18, 20.5.1]
|
||||
include:
|
||||
- os: macos-latest
|
||||
NODE_VERSION: 18
|
||||
|
|
|
|||
15
.github/workflows/cleanup-cache.yml
vendored
15
.github/workflows/cleanup-cache.yml
vendored
|
|
@ -1,19 +1,28 @@
|
|||
name: Cleanup cache
|
||||
|
||||
on:
|
||||
schedule:
|
||||
- cron: "0 11 * * *"
|
||||
pull_request:
|
||||
types:
|
||||
- closed
|
||||
|
||||
# Workflow copied from https://docs.github.com/en/actions/using-workflows/caching-dependencies-to-speed-up-workflows#force-deleting-cache-entries
|
||||
jobs:
|
||||
cleanup:
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
- name: Check out code
|
||||
uses: actions/checkout@v3
|
||||
|
||||
- name: Cleanup
|
||||
|
||||
- name: Cleanup caches older than 5 days
|
||||
if: github.event_name == 'schedule'
|
||||
uses: MyAlbum/purge-cache@v2
|
||||
with:
|
||||
max-age: 432000
|
||||
|
||||
# https://docs.github.com/en/actions/using-workflows/caching-dependencies-to-speed-up-workflows#force-deleting-cache-entries
|
||||
- name: Cleanup on PR close
|
||||
if: github.event_name == 'pull_request'
|
||||
run: |
|
||||
gh extension install actions/gh-actions-cache
|
||||
|
||||
|
|
|
|||
|
|
@ -1,10 +1,3 @@
|
|||
# Ignoring these files for now due to https://github.com/withastro/compiler/issues/585
|
||||
examples/basics/src/layouts
|
||||
examples/with-nanostores/src/layouts
|
||||
|
||||
# Ignoring this file for now due to https://github.com/withastro/compiler/issues/485
|
||||
packages/markdown/component/Markdown.astro
|
||||
|
||||
# Benchmark artifacts
|
||||
benchmark/projects/
|
||||
benchmark/results/
|
||||
|
|
|
|||
|
|
@ -1,24 +0,0 @@
|
|||
// Heads up: This file should be renamed to `.cjs`, however if we did that, changesets wouldn't be able to load it
|
||||
module.exports = {
|
||||
printWidth: 100,
|
||||
semi: true,
|
||||
singleQuote: true,
|
||||
tabWidth: 2,
|
||||
trailingComma: 'es5',
|
||||
useTabs: true,
|
||||
plugins: ['prettier-plugin-astro'],
|
||||
overrides: [
|
||||
{
|
||||
files: ['.*', '*.json', '*.md', '*.toml', '*.yml'],
|
||||
options: {
|
||||
useTabs: false,
|
||||
},
|
||||
},
|
||||
{
|
||||
files: ['**/*.astro'],
|
||||
options: {
|
||||
parser: 'astro',
|
||||
},
|
||||
},
|
||||
],
|
||||
};
|
||||
|
|
@ -83,7 +83,7 @@ Several official projects are maintained outside of this repo:
|
|||
|
||||
## Sponsors
|
||||
|
||||
Astro is generously supported by Netlify, Storyblok, and several other amazing organizations.
|
||||
Astro is free, open source software made possible by these wonderful sponsors.
|
||||
|
||||
[❤️ Sponsor Astro! ❤️](https://github.com/withastro/.github/blob/main/FUNDING.md)
|
||||
|
||||
|
|
@ -91,7 +91,7 @@ Astro is generously supported by Netlify, Storyblok, and several other amazing o
|
|||
<a target="_blank" href="https://github.com/sponsors/withastro">
|
||||
|
||||
[](https://github.com/sponsors/withastro)
|
||||
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@
|
|||
|
||||
The easiest way to check out one of these examples on your machine is by running this command in an empty directory:
|
||||
|
||||
```
|
||||
```sh
|
||||
npm create astro@latest -- --template [EXAMPLE_NAME]
|
||||
```
|
||||
|
||||
|
|
@ -10,12 +10,12 @@ npm create astro@latest -- --template [EXAMPLE_NAME]
|
|||
|
||||
Visit [awesome-astro](https://github.com/one-aalam/awesome-astro) for a full list of community examples. You can use `npm create astro@latest` to check out any community examples:
|
||||
|
||||
```
|
||||
```sh
|
||||
npm create astro@latest -- --template [GITHUB_USER]/[REPO_NAME]
|
||||
```
|
||||
|
||||
Paths to examples nested inside of a repo are also supported:
|
||||
|
||||
```
|
||||
```sh
|
||||
npm create astro@latest -- --template [GITHUB_USER]/[REPO_NAME]/path/to/example
|
||||
```
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
# Astro Starter Kit: Basics
|
||||
|
||||
```
|
||||
```sh
|
||||
npm create astro@latest -- --template basics
|
||||
```
|
||||
|
||||
|
|
@ -16,7 +16,7 @@ npm create astro@latest -- --template basics
|
|||
|
||||
Inside of your Astro project, you'll see the following folders and files:
|
||||
|
||||
```
|
||||
```text
|
||||
/
|
||||
├── public/
|
||||
│ └── favicon.svg
|
||||
|
|
|
|||
|
|
@ -11,6 +11,6 @@
|
|||
"astro": "astro"
|
||||
},
|
||||
"dependencies": {
|
||||
"astro": "^3.0.8"
|
||||
"astro": "^3.0.12"
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
---
|
||||
---
|
||||
interface Props {
|
||||
title: string;
|
||||
}
|
||||
|
|
@ -6,11 +6,11 @@ interface Props {
|
|||
const { title } = Astro.props;
|
||||
---
|
||||
|
||||
<!DOCTYPE html>
|
||||
<!doctype html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="description" content="Astro description">
|
||||
<meta name="description" content="Astro description" />
|
||||
<meta name="viewport" content="width=device-width" />
|
||||
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
|
||||
<meta name="generator" content={Astro.generator} />
|
||||
|
|
@ -25,15 +25,27 @@ const { title } = Astro.props;
|
|||
--accent: 136, 58, 234;
|
||||
--accent-light: 224, 204, 250;
|
||||
--accent-dark: 49, 10, 101;
|
||||
--accent-gradient: linear-gradient(45deg, rgb(var(--accent)), rgb(var(--accent-light)) 30%, white 60%);
|
||||
--accent-gradient: linear-gradient(
|
||||
45deg,
|
||||
rgb(var(--accent)),
|
||||
rgb(var(--accent-light)) 30%,
|
||||
white 60%
|
||||
);
|
||||
}
|
||||
html {
|
||||
font-family: system-ui, sans-serif;
|
||||
background: #13151A;
|
||||
background: #13151a;
|
||||
background-size: 224px;
|
||||
}
|
||||
code {
|
||||
font-family: Menlo, Monaco, Lucida Console, Liberation Mono, DejaVu Sans Mono,
|
||||
Bitstream Vera Sans Mono, Courier New, monospace;
|
||||
font-family:
|
||||
Menlo,
|
||||
Monaco,
|
||||
Lucida Console,
|
||||
Liberation Mono,
|
||||
DejaVu Sans Mono,
|
||||
Bitstream Vera Sans Mono,
|
||||
Courier New,
|
||||
monospace;
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
# Astro Starter Kit: Blog
|
||||
|
||||
```
|
||||
```sh
|
||||
npm create astro@latest -- --template blog
|
||||
```
|
||||
|
||||
|
|
@ -25,7 +25,7 @@ Features:
|
|||
|
||||
Inside of your Astro project, you'll see the following folders and files:
|
||||
|
||||
```
|
||||
```text
|
||||
├── public/
|
||||
├── src/
|
||||
│ ├── components/
|
||||
|
|
|
|||
|
|
@ -11,9 +11,9 @@
|
|||
"astro": "astro"
|
||||
},
|
||||
"dependencies": {
|
||||
"@astrojs/mdx": "^1.0.0",
|
||||
"@astrojs/mdx": "^1.0.3",
|
||||
"@astrojs/rss": "^3.0.0",
|
||||
"@astrojs/sitemap": "^3.0.0",
|
||||
"astro": "^3.0.8"
|
||||
"astro": "^3.0.12"
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -11,7 +11,7 @@ const posts = (await getCollection('blog')).sort(
|
|||
);
|
||||
---
|
||||
|
||||
<!DOCTYPE html>
|
||||
<!doctype html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<BaseHead title={SITE_TITLE} description={SITE_DESCRIPTION} />
|
||||
|
|
|
|||
|
|
@ -5,7 +5,7 @@ import Footer from '../components/Footer.astro';
|
|||
import { SITE_TITLE, SITE_DESCRIPTION } from '../consts';
|
||||
---
|
||||
|
||||
<!DOCTYPE html>
|
||||
<!doctype html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<BaseHead title={SITE_TITLE} description={SITE_DESCRIPTION} />
|
||||
|
|
@ -16,14 +16,14 @@ import { SITE_TITLE, SITE_DESCRIPTION } from '../consts';
|
|||
<h1>🧑🚀 Hello, Astronaut!</h1>
|
||||
<p>
|
||||
Welcome to the official <a href="https://astro.build/">Astro</a> blog starter template. This
|
||||
template serves as a lightweight, minimally-styled starting point for anyone looking to build
|
||||
a personal website, blog, or portfolio with Astro.
|
||||
template serves as a lightweight, minimally-styled starting point for anyone looking to
|
||||
build a personal website, blog, or portfolio with Astro.
|
||||
</p>
|
||||
<p>
|
||||
This template comes with a few integrations already configured in your
|
||||
<code>astro.config.mjs</code> file. You can customize your setup with
|
||||
<a href="https://astro.build/integrations">Astro Integrations</a> to add tools like Tailwind,
|
||||
React, or Vue to your project.
|
||||
<a href="https://astro.build/integrations">Astro Integrations</a> to add tools like
|
||||
Tailwind, React, or Vue to your project.
|
||||
</p>
|
||||
<p>Here are a few ideas on how to get started with the template:</p>
|
||||
<ul>
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@
|
|||
|
||||
This is a template for an Astro component library. Use this template for writing components to use in multiple projects or publish to NPM.
|
||||
|
||||
```
|
||||
```sh
|
||||
npm create astro@latest -- --template component
|
||||
```
|
||||
|
||||
|
|
@ -14,7 +14,7 @@ npm create astro@latest -- --template component
|
|||
|
||||
Inside of your Astro project, you'll see the following folders and files:
|
||||
|
||||
```
|
||||
```text
|
||||
/
|
||||
├── index.ts
|
||||
├── src
|
||||
|
|
|
|||
|
|
@ -15,7 +15,7 @@
|
|||
],
|
||||
"scripts": {},
|
||||
"devDependencies": {
|
||||
"astro": "^3.0.8"
|
||||
"astro": "^3.0.12"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"astro": "^2.0.0-beta.0"
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@
|
|||
[](https://codesandbox.io/p/sandbox/github/withastro/astro/tree/latest/examples/deno)
|
||||
[](https://codespaces.new/withastro/astro?devcontainer_path=.devcontainer/deno/devcontainer.json)
|
||||
|
||||
```
|
||||
```sh
|
||||
npm create astro@latest -- --template deno
|
||||
```
|
||||
|
||||
|
|
@ -16,7 +16,7 @@ npm create astro@latest -- --template deno
|
|||
|
||||
Inside of your Astro project, you'll see the following folders and files:
|
||||
|
||||
```
|
||||
```text
|
||||
/
|
||||
├── public/
|
||||
│ └── favicon.svg
|
||||
|
|
|
|||
|
|
@ -10,7 +10,7 @@
|
|||
"astro": "astro"
|
||||
},
|
||||
"dependencies": {
|
||||
"astro": "^3.0.8"
|
||||
"astro": "^3.0.12"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@astrojs/deno": "^5.0.0"
|
||||
|
|
|
|||
|
|
@ -6,7 +6,7 @@ interface Props {
|
|||
const { title } = Astro.props as Props;
|
||||
---
|
||||
|
||||
<!DOCTYPE html>
|
||||
<!doctype html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
|
|
@ -46,8 +46,15 @@ const { title } = Astro.props as Props;
|
|||
}
|
||||
|
||||
:global(code) {
|
||||
font-family: Menlo, Monaco, Lucida Console, Liberation Mono, DejaVu Sans Mono,
|
||||
Bitstream Vera Sans Mono, Courier New, monospace;
|
||||
font-family:
|
||||
Menlo,
|
||||
Monaco,
|
||||
Lucida Console,
|
||||
Liberation Mono,
|
||||
DejaVu Sans Mono,
|
||||
Bitstream Vera Sans Mono,
|
||||
Courier New,
|
||||
monospace;
|
||||
}
|
||||
</style>
|
||||
</body>
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
# Astro + AlpineJS Example
|
||||
|
||||
```
|
||||
```sh
|
||||
npm create astro@latest -- --template framework-alpine
|
||||
```
|
||||
|
||||
|
|
|
|||
|
|
@ -14,6 +14,6 @@
|
|||
"@astrojs/alpinejs": "^0.3.0",
|
||||
"@types/alpinejs": "^3.7.2",
|
||||
"alpinejs": "^3.12.3",
|
||||
"astro": "^3.0.8"
|
||||
"astro": "^3.0.12"
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
# Astro + Lit Example
|
||||
|
||||
```
|
||||
```sh
|
||||
npm create astro@latest -- --template framework-lit
|
||||
```
|
||||
|
||||
|
|
|
|||
|
|
@ -13,7 +13,7 @@
|
|||
"dependencies": {
|
||||
"@astrojs/lit": "^3.0.0",
|
||||
"@webcomponents/template-shadowroot": "^0.2.1",
|
||||
"astro": "^3.0.8",
|
||||
"astro": "^3.0.12",
|
||||
"lit": "^2.8.0"
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -7,7 +7,7 @@ import { MyCounter } from '../components/my-counter.js';
|
|||
// https://docs.astro.build/core-concepts/astro-components/
|
||||
---
|
||||
|
||||
<!DOCTYPE html>
|
||||
<!doctype html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
# Kitchen Sink: Microfrontends with Astro
|
||||
|
||||
```
|
||||
```sh
|
||||
npm create astro@latest -- --template framework-multiple
|
||||
```
|
||||
|
||||
|
|
|
|||
|
|
@ -12,11 +12,11 @@
|
|||
},
|
||||
"dependencies": {
|
||||
"@astrojs/preact": "^3.0.0",
|
||||
"@astrojs/react": "^3.0.0",
|
||||
"@astrojs/solid-js": "^3.0.0",
|
||||
"@astrojs/svelte": "^4.0.0",
|
||||
"@astrojs/react": "^3.0.2",
|
||||
"@astrojs/solid-js": "^3.0.1",
|
||||
"@astrojs/svelte": "^4.0.2",
|
||||
"@astrojs/vue": "^3.0.0",
|
||||
"astro": "^3.0.8",
|
||||
"astro": "^3.0.12",
|
||||
"preact": "^10.17.1",
|
||||
"react": "^18.2.0",
|
||||
"react-dom": "^18.2.0",
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
# Astro + Preact Example
|
||||
|
||||
```
|
||||
```sh
|
||||
npm create astro@latest -- --template framework-preact
|
||||
```
|
||||
|
||||
|
|
|
|||
|
|
@ -13,7 +13,7 @@
|
|||
"dependencies": {
|
||||
"@astrojs/preact": "^3.0.0",
|
||||
"@preact/signals": "^1.2.1",
|
||||
"astro": "^3.0.8",
|
||||
"astro": "^3.0.12",
|
||||
"preact": "^10.17.1"
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
# Astro + React Example
|
||||
|
||||
```
|
||||
```sh
|
||||
npm create astro@latest -- --template framework-react
|
||||
```
|
||||
|
||||
|
|
|
|||
|
|
@ -11,10 +11,10 @@
|
|||
"astro": "astro"
|
||||
},
|
||||
"dependencies": {
|
||||
"@astrojs/react": "^3.0.0",
|
||||
"@astrojs/react": "^3.0.2",
|
||||
"@types/react": "^18.2.21",
|
||||
"@types/react-dom": "^18.2.7",
|
||||
"astro": "^3.0.8",
|
||||
"astro": "^3.0.12",
|
||||
"react": "^18.2.0",
|
||||
"react-dom": "^18.2.0"
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
# Astro + Solid.js Example
|
||||
|
||||
```
|
||||
```sh
|
||||
npm create astro@latest -- --template framework-solid
|
||||
```
|
||||
|
||||
|
|
|
|||
|
|
@ -11,8 +11,8 @@
|
|||
"astro": "astro"
|
||||
},
|
||||
"dependencies": {
|
||||
"@astrojs/solid-js": "^3.0.0",
|
||||
"astro": "^3.0.8",
|
||||
"@astrojs/solid-js": "^3.0.1",
|
||||
"astro": "^3.0.12",
|
||||
"solid-js": "^1.7.11"
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
# Astro + Svelte Example
|
||||
|
||||
```
|
||||
```sh
|
||||
npm create astro@latest -- --template framework-svelte
|
||||
```
|
||||
|
||||
|
|
|
|||
|
|
@ -11,8 +11,8 @@
|
|||
"astro": "astro"
|
||||
},
|
||||
"dependencies": {
|
||||
"@astrojs/svelte": "^4.0.0",
|
||||
"astro": "^3.0.8",
|
||||
"@astrojs/svelte": "^4.0.2",
|
||||
"astro": "^3.0.12",
|
||||
"svelte": "^4.2.0"
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
# Astro + Vue Example
|
||||
|
||||
```
|
||||
```sh
|
||||
npm create astro@latest -- --template framework-vue
|
||||
```
|
||||
|
||||
|
|
|
|||
|
|
@ -12,7 +12,7 @@
|
|||
},
|
||||
"dependencies": {
|
||||
"@astrojs/vue": "^3.0.0",
|
||||
"astro": "^3.0.8",
|
||||
"astro": "^3.0.12",
|
||||
"vue": "^3.3.4"
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
# Astro Starter Kit: Hackernews
|
||||
|
||||
```
|
||||
```sh
|
||||
npm create astro@latest -- --template hackernews
|
||||
```
|
||||
|
||||
|
|
@ -14,7 +14,7 @@ npm create astro@latest -- --template hackernews
|
|||
|
||||
Inside of your Astro project, you'll see the following folders and files:
|
||||
|
||||
```
|
||||
```text
|
||||
/
|
||||
├── public/
|
||||
│ └── favicon.svg
|
||||
|
|
|
|||
|
|
@ -12,6 +12,6 @@
|
|||
},
|
||||
"dependencies": {
|
||||
"@astrojs/node": "^6.0.0",
|
||||
"astro": "^3.0.8"
|
||||
"astro": "^3.0.12"
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -25,7 +25,7 @@ const story = (await fetchAPI(`item/${id}`)) as IStory;
|
|||
<a href={`/users/${story.user}`}>
|
||||
{story.user}
|
||||
</a>
|
||||
{story.time_ago}
|
||||
{story.time_ago}
|
||||
</p>
|
||||
</header>
|
||||
<main>
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@
|
|||
|
||||
This is a template for an Astro integration. Use this template for writing integrations to use in multiple projects or publish to NPM.
|
||||
|
||||
```
|
||||
```sh
|
||||
npm create astro@latest -- --template integration
|
||||
```
|
||||
|
||||
|
|
@ -14,7 +14,7 @@ npm create astro@latest -- --template integration
|
|||
|
||||
Inside of your Astro project, you'll see the following folders and files:
|
||||
|
||||
```
|
||||
```text
|
||||
/
|
||||
├── index.ts
|
||||
├── tsconfig.json
|
||||
|
|
|
|||
|
|
@ -15,7 +15,7 @@
|
|||
],
|
||||
"scripts": {},
|
||||
"devDependencies": {
|
||||
"astro": "^3.0.8"
|
||||
"astro": "^3.0.12"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"astro": "^2.0.0-beta.0"
|
||||
|
|
|
|||
|
|
@ -13,7 +13,7 @@
|
|||
},
|
||||
"dependencies": {
|
||||
"@astrojs/node": "^6.0.0",
|
||||
"astro": "^3.0.8",
|
||||
"astro": "^3.0.12",
|
||||
"html-minifier": "^4.0.0"
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -30,7 +30,9 @@ const { href, title, body } = Astro.props;
|
|||
border-radius: 0.6rem;
|
||||
background-position: 100%;
|
||||
transition: background-position 0.6s cubic-bezier(0.22, 1, 0.36, 1);
|
||||
box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -2px rgba(0, 0, 0, 0.1);
|
||||
box-shadow:
|
||||
0 4px 6px -1px rgba(0, 0, 0, 0.1),
|
||||
0 2px 4px -2px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
|
||||
.link-card > a {
|
||||
|
|
|
|||
|
|
@ -6,7 +6,7 @@ interface Props {
|
|||
const { title } = Astro.props;
|
||||
---
|
||||
|
||||
<!DOCTYPE html>
|
||||
<!doctype html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
|
|
@ -29,7 +29,14 @@ const { title } = Astro.props;
|
|||
background-color: #f6f6f6;
|
||||
}
|
||||
code {
|
||||
font-family: Menlo, Monaco, Lucida Console, Liberation Mono, DejaVu Sans Mono,
|
||||
Bitstream Vera Sans Mono, Courier New, monospace;
|
||||
font-family:
|
||||
Menlo,
|
||||
Monaco,
|
||||
Lucida Console,
|
||||
Liberation Mono,
|
||||
DejaVu Sans Mono,
|
||||
Bitstream Vera Sans Mono,
|
||||
Courier New,
|
||||
monospace;
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
# Astro Starter Kit: Minimal
|
||||
|
||||
```
|
||||
```sh
|
||||
npm create astro@latest -- --template minimal
|
||||
```
|
||||
|
||||
|
|
@ -14,7 +14,7 @@ npm create astro@latest -- --template minimal
|
|||
|
||||
Inside of your Astro project, you'll see the following folders and files:
|
||||
|
||||
```
|
||||
```text
|
||||
/
|
||||
├── public/
|
||||
├── src/
|
||||
|
|
|
|||
|
|
@ -11,6 +11,6 @@
|
|||
"astro": "astro"
|
||||
},
|
||||
"dependencies": {
|
||||
"astro": "^3.0.8"
|
||||
"astro": "^3.0.12"
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,4 +1,5 @@
|
|||
---
|
||||
|
||||
---
|
||||
|
||||
<html lang="en">
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@ Documentation for "Non-HTML Pages":
|
|||
|
||||
https://docs.astro.build/en/core-concepts/endpoints/#static-file-endpoints
|
||||
|
||||
```
|
||||
```sh
|
||||
npm create astro@latest -- --template non-html-pages
|
||||
```
|
||||
|
||||
|
|
@ -18,7 +18,7 @@ npm create astro@latest -- --template non-html-pages
|
|||
|
||||
Inside of your Astro project, you'll see the following folders and files:
|
||||
|
||||
```
|
||||
```text
|
||||
/
|
||||
├── public/
|
||||
├── src/
|
||||
|
|
|
|||
|
|
@ -11,6 +11,6 @@
|
|||
"astro": "astro"
|
||||
},
|
||||
"dependencies": {
|
||||
"astro": "^3.0.8"
|
||||
"astro": "^3.0.12"
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
# Astro Starter Kit: Portfolio
|
||||
|
||||
```
|
||||
```sh
|
||||
npm create astro@latest -- --template portfolio
|
||||
```
|
||||
|
||||
|
|
|
|||
|
|
@ -11,6 +11,6 @@
|
|||
"astro": "astro"
|
||||
},
|
||||
"dependencies": {
|
||||
"astro": "^3.0.8"
|
||||
"astro": "^3.0.12"
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -25,7 +25,7 @@ const iconLinks: { label: string; href: string; icon: keyof typeof iconPaths }[]
|
|||
<div class="menu-header">
|
||||
<a href="/" class="site-title">
|
||||
<Icon icon="terminal-window" color="var(--accent-regular)" size="1.6em" gradient />
|
||||
Jeanine White
|
||||
Jeanine White
|
||||
</a>
|
||||
<menu-button>
|
||||
<template>
|
||||
|
|
@ -321,7 +321,9 @@ const iconLinks: { label: string; href: string; icon: keyof typeof iconPaths }[]
|
|||
.link {
|
||||
padding: 0.5rem 1rem;
|
||||
border-radius: 999rem;
|
||||
transition: color var(--theme-transition), background-color var(--theme-transition);
|
||||
transition:
|
||||
color var(--theme-transition),
|
||||
background-color var(--theme-transition);
|
||||
}
|
||||
|
||||
.link:hover,
|
||||
|
|
|
|||
|
|
@ -54,7 +54,9 @@ import Icon from './Icon.astro';
|
|||
@media (prefers-reduced-motion: no-preference) {
|
||||
.icon,
|
||||
.icon.light::before {
|
||||
transition: transform var(--theme-transition), color var(--theme-transition);
|
||||
transition:
|
||||
transform var(--theme-transition),
|
||||
color var(--theme-transition);
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -92,13 +92,18 @@ const { title, description } = Astro.props;
|
|||
min-height: 100%;
|
||||
isolation: isolate;
|
||||
background:
|
||||
/*noise*/ url('/assets/backgrounds/noise.png') top center/220px repeat,
|
||||
/*noise*/
|
||||
url('/assets/backgrounds/noise.png') top center/220px repeat,
|
||||
/*footer*/ var(--bg-image-footer) bottom center/var(--bg-gradient-size) no-repeat,
|
||||
/*header1*/ var(--bg-image-main-curves) top center/var(--bg-gradient-size) no-repeat,
|
||||
/*header2*/ var(--bg-image-main) top center/var(--bg-gradient-size) no-repeat,
|
||||
/*base*/ var(--gray-999);
|
||||
background-blend-mode: /*noise*/ overlay, /*footer*/ var(--bg-blend-mode),
|
||||
/*header1*/ var(--bg-svg-blend-mode), /*header2*/ normal, /*base*/ normal;
|
||||
background-blend-mode: /*noise*/
|
||||
overlay,
|
||||
/*footer*/ var(--bg-blend-mode),
|
||||
/*header1*/ var(--bg-svg-blend-mode),
|
||||
/*header2*/ normal,
|
||||
/*base*/ normal;
|
||||
}
|
||||
@media (forced-colors: active) {
|
||||
/* Deactivate custom backgrounds for high contrast users. */
|
||||
|
|
|
|||
|
|
@ -25,9 +25,10 @@ import Hero from '../components/Hero.astro';
|
|||
<div class="content">
|
||||
<p>
|
||||
Lorem ipsum dolor sit amet, <a href="https://astro.build/">Astro</a> makes people happy.
|
||||
Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Proin nibh nisl condimentum
|
||||
id venenatis a condimentum vitae. Dapibus ultrices in iaculis nunc. Arcu odio ut sem nulla
|
||||
pharetra diam sit amet. Diam quis enim lobortis scelerisque fermentum dui faucibus in ornare.
|
||||
Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Proin nibh nisl
|
||||
condimentum id venenatis a condimentum vitae. Dapibus ultrices in iaculis nunc. Arcu
|
||||
odio ut sem nulla pharetra diam sit amet. Diam quis enim lobortis scelerisque fermentum
|
||||
dui faucibus in ornare.
|
||||
</p>
|
||||
<p>
|
||||
Arcu dui vivamus arcu felis bibendum ut tristique et egestas. Eget gravida cum sociis
|
||||
|
|
|
|||
|
|
@ -169,8 +169,10 @@ const projects = (await getCollection('work'))
|
|||
aspect-ratio: calc(2.25 / var(--bg-scale));
|
||||
top: 0;
|
||||
transform: translateY(-75%) translateX(-50%);
|
||||
background: url('/assets/backgrounds/noise.png') top center/220px repeat,
|
||||
var(--hero-bg) center center / var(--bg-gradient-size) no-repeat, var(--gray-999);
|
||||
background:
|
||||
url('/assets/backgrounds/noise.png') top center/220px repeat,
|
||||
var(--hero-bg) center center / var(--bg-gradient-size) no-repeat,
|
||||
var(--gray-999);
|
||||
background-blend-mode: overlay, normal, normal, normal;
|
||||
mix-blend-mode: var(--bg-blend-mode);
|
||||
z-index: -1;
|
||||
|
|
|
|||
|
|
@ -13,8 +13,8 @@
|
|||
},
|
||||
"dependencies": {
|
||||
"@astrojs/node": "^6.0.0",
|
||||
"@astrojs/svelte": "^4.0.0",
|
||||
"astro": "^3.0.8",
|
||||
"@astrojs/svelte": "^4.0.2",
|
||||
"astro": "^3.0.12",
|
||||
"svelte": "^4.2.0"
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@
|
|||
|
||||
This starter showcases the experimental Markdoc integration.
|
||||
|
||||
```
|
||||
```sh
|
||||
npm create astro@latest -- --template with-markdoc
|
||||
```
|
||||
|
||||
|
|
@ -15,7 +15,7 @@ npm create astro@latest -- --template with-markdoc
|
|||
|
||||
Inside of your Astro project, you'll see the following folders and files:
|
||||
|
||||
```
|
||||
```text
|
||||
/
|
||||
├── public/
|
||||
├── src/
|
||||
|
|
|
|||
|
|
@ -12,6 +12,6 @@
|
|||
},
|
||||
"dependencies": {
|
||||
"@astrojs/markdoc": "^0.5.0",
|
||||
"astro": "^3.0.8"
|
||||
"astro": "^3.0.12"
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -6,7 +6,7 @@ interface Props {
|
|||
const { title } = Astro.props;
|
||||
---
|
||||
|
||||
<!DOCTYPE html>
|
||||
<!doctype html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
|
|
@ -25,8 +25,15 @@ const { title } = Astro.props;
|
|||
background-color: #f6f6f6;
|
||||
}
|
||||
code {
|
||||
font-family: Menlo, Monaco, Lucida Console, Liberation Mono, DejaVu Sans Mono,
|
||||
Bitstream Vera Sans Mono, Courier New, monospace;
|
||||
font-family:
|
||||
Menlo,
|
||||
Monaco,
|
||||
Lucida Console,
|
||||
Liberation Mono,
|
||||
DejaVu Sans Mono,
|
||||
Bitstream Vera Sans Mono,
|
||||
Courier New,
|
||||
monospace;
|
||||
}
|
||||
main {
|
||||
margin: auto;
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
# Astro Example: Markdown with Plugins
|
||||
|
||||
```
|
||||
```sh
|
||||
npm create astro@latest -- --template with-markdown-plugins
|
||||
```
|
||||
|
||||
|
|
|
|||
|
|
@ -11,8 +11,8 @@
|
|||
"astro": "astro"
|
||||
},
|
||||
"dependencies": {
|
||||
"@astrojs/markdown-remark": "^3.0.0",
|
||||
"astro": "^3.0.8",
|
||||
"@astrojs/markdown-remark": "^3.1.0",
|
||||
"astro": "^3.0.12",
|
||||
"hast-util-select": "^5.0.5",
|
||||
"rehype-autolink-headings": "^6.1.1",
|
||||
"rehype-slug": "^5.1.0",
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
# Astro Example: Markdown with Shiki
|
||||
|
||||
```
|
||||
```sh
|
||||
npm create astro@latest -- --template with-markdown-shiki
|
||||
```
|
||||
|
||||
|
|
|
|||
|
|
@ -11,6 +11,6 @@
|
|||
"astro": "astro"
|
||||
},
|
||||
"dependencies": {
|
||||
"astro": "^3.0.8"
|
||||
"astro": "^3.0.12"
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
# Astro Example: MDX
|
||||
|
||||
```
|
||||
```sh
|
||||
npm create astro@latest -- --template with-mdx
|
||||
```
|
||||
|
||||
|
|
|
|||
|
|
@ -11,9 +11,9 @@
|
|||
"astro": "astro"
|
||||
},
|
||||
"dependencies": {
|
||||
"@astrojs/mdx": "^1.0.0",
|
||||
"@astrojs/mdx": "^1.0.3",
|
||||
"@astrojs/preact": "^3.0.0",
|
||||
"astro": "^3.0.8",
|
||||
"astro": "^3.0.12",
|
||||
"preact": "^10.17.1"
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
# Astro Example: Nanostores
|
||||
|
||||
```
|
||||
```sh
|
||||
npm create astro@latest -- --template with-nanostores
|
||||
```
|
||||
|
||||
|
|
|
|||
|
|
@ -13,7 +13,7 @@
|
|||
"dependencies": {
|
||||
"@astrojs/preact": "^3.0.0",
|
||||
"@nanostores/preact": "^0.5.0",
|
||||
"astro": "^3.0.8",
|
||||
"astro": "^3.0.12",
|
||||
"nanostores": "^0.9.3",
|
||||
"preact": "^10.17.1"
|
||||
}
|
||||
|
|
|
|||
|
|
@ -9,25 +9,27 @@ interface Props {
|
|||
const { title } = Astro.props;
|
||||
---
|
||||
|
||||
<!DOCTYPE html>
|
||||
<!doctype html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width">
|
||||
<meta name="generator" content={Astro.generator} />
|
||||
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
|
||||
<title>{title}</title>
|
||||
</head>
|
||||
<body>
|
||||
<header>
|
||||
<nav>
|
||||
<a href="/" class="nav-header"><span style="color: var(--astro-blue)">Astro</span> storefront</a>
|
||||
<CartFlyoutToggle client:load />
|
||||
</nav>
|
||||
</header>
|
||||
<slot />
|
||||
<CartFlyout client:load />
|
||||
</body>
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width" />
|
||||
<meta name="generator" content={Astro.generator} />
|
||||
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
|
||||
<title>{title}</title>
|
||||
</head>
|
||||
<body>
|
||||
<header>
|
||||
<nav>
|
||||
<a href="/" class="nav-header"
|
||||
><span style="color: var(--astro-blue)">Astro</span> storefront</a
|
||||
>
|
||||
<CartFlyoutToggle client:load />
|
||||
</nav>
|
||||
</header>
|
||||
<slot />
|
||||
<CartFlyout client:load />
|
||||
</body>
|
||||
</html>
|
||||
|
||||
<style is:global>
|
||||
|
|
@ -35,14 +37,14 @@ const { title } = Astro.props;
|
|||
--font-family: system-ui, sans-serif;
|
||||
--font-size-base: clamp(1rem, 0.34vw + 0.91rem, 1.19rem);
|
||||
--font-size-lg: clamp(1.2rem, 0.7vw + 1.2rem, 1.5rem);
|
||||
--font-size-xl: clamp(2.0rem, 1.75vw + 1.35rem, 2.75rem);
|
||||
--font-size-xl: clamp(2rem, 1.75vw + 1.35rem, 2.75rem);
|
||||
|
||||
--color-text: hsl(12, 5%, 4%);
|
||||
--color-bg: hsl(17, 20%, 97%);
|
||||
--color-bg-2: hsl(17, 20%, 94%);
|
||||
--color-bg-3: hsl(17, 20%, 88%);
|
||||
--astro-blue: #4F39FA;
|
||||
--astro-pink: #DA62C4;
|
||||
--astro-blue: #4f39fa;
|
||||
--astro-pink: #da62c4;
|
||||
|
||||
--content-max-width: 90ch;
|
||||
--nav-height: clamp(2.44rem, 2.38vw + 1.85rem, 3.75rem);
|
||||
|
|
@ -56,7 +58,9 @@ const { title } = Astro.props;
|
|||
border: none;
|
||||
color: var(--astro-blue);
|
||||
border: 2px solid var(--astro-blue);
|
||||
transition: color 0.2s, background-color 0.2s;
|
||||
transition:
|
||||
color 0.2s,
|
||||
background-color 0.2s;
|
||||
background-color: transparent;
|
||||
padding: 0.4rem 0.8rem;
|
||||
border-radius: 0.4rem;
|
||||
|
|
@ -98,7 +102,8 @@ const { title } = Astro.props;
|
|||
align-items: center;
|
||||
}
|
||||
|
||||
.nav-header, .nav-header:visited {
|
||||
.nav-header,
|
||||
.nav-header:visited {
|
||||
font-size: var(--font-size-base);
|
||||
font-weight: bold;
|
||||
color: inherit;
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
# Astro with Tailwind
|
||||
|
||||
```
|
||||
```sh
|
||||
npm create astro@latest -- --template with-tailwindcss
|
||||
```
|
||||
|
||||
|
|
|
|||
|
|
@ -11,10 +11,10 @@
|
|||
"astro": "astro"
|
||||
},
|
||||
"dependencies": {
|
||||
"@astrojs/mdx": "^1.0.0",
|
||||
"@astrojs/mdx": "^1.0.3",
|
||||
"@astrojs/tailwind": "^5.0.0",
|
||||
"@types/canvas-confetti": "^1.6.0",
|
||||
"astro": "^3.0.8",
|
||||
"astro": "^3.0.12",
|
||||
"autoprefixer": "^10.4.15",
|
||||
"canvas-confetti": "^1.6.0",
|
||||
"postcss": "^8.4.28",
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
# Astro Starter Kit: Vite PWA
|
||||
|
||||
```
|
||||
```sh
|
||||
npm create astro@latest -- --template with-vite-plugin-pwa
|
||||
```
|
||||
|
||||
|
|
@ -14,7 +14,7 @@ npm create astro@latest -- --template with-vite-plugin-pwa
|
|||
|
||||
Inside of your Astro project, you'll see the following folders and files:
|
||||
|
||||
```
|
||||
```text
|
||||
/
|
||||
├── public/
|
||||
├── src/
|
||||
|
|
|
|||
|
|
@ -11,7 +11,7 @@
|
|||
"astro": "astro"
|
||||
},
|
||||
"dependencies": {
|
||||
"astro": "^3.0.8",
|
||||
"astro": "^3.0.12",
|
||||
"vite-plugin-pwa": "0.16.4",
|
||||
"workbox-window": "^7.0.0"
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,4 +1,5 @@
|
|||
---
|
||||
|
||||
---
|
||||
|
||||
<html lang="en">
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
# Astro + [Vitest](https://vitest.dev/) Example
|
||||
|
||||
```
|
||||
```sh
|
||||
npm create astro@latest -- --template with-vitest
|
||||
```
|
||||
|
||||
|
|
|
|||
|
|
@ -12,7 +12,7 @@
|
|||
"test": "vitest"
|
||||
},
|
||||
"dependencies": {
|
||||
"astro": "^3.0.8",
|
||||
"astro": "^3.0.12",
|
||||
"vitest": "^0.34.2"
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,4 +1,5 @@
|
|||
---
|
||||
|
||||
---
|
||||
|
||||
<html lang="en">
|
||||
|
|
|
|||
|
|
@ -1,5 +1,6 @@
|
|||
{
|
||||
"name": "root",
|
||||
"type": "module",
|
||||
"version": "0.0.0",
|
||||
"private": true,
|
||||
"repository": {
|
||||
|
|
@ -14,7 +15,7 @@
|
|||
"dev": "turbo run dev --concurrency=40 --parallel --filter=astro --filter=create-astro --filter=\"@astrojs/*\" --filter=\"@benchmark/*\"",
|
||||
"format": "pnpm run format:code",
|
||||
"format:ci": "pnpm run format:imports && pnpm run format:code",
|
||||
"format:code": "prettier -w . --cache",
|
||||
"format:code": "prettier -w \"**/*\" --ignore-unknown --cache",
|
||||
"format:imports": "organize-imports-cli ./packages/*/tsconfig.json ./packages/*/*/tsconfig.json",
|
||||
"test": "turbo run test --concurrency=1 --filter=astro --filter=create-astro --filter=\"@astrojs/*\"",
|
||||
"test:match": "cd packages/astro && pnpm run test:match",
|
||||
|
|
@ -89,7 +90,7 @@
|
|||
"eslint-plugin-prettier": "^5.0.0",
|
||||
"only-allow": "^1.1.1",
|
||||
"organize-imports-cli": "^0.10.0",
|
||||
"prettier": "^3.0.2",
|
||||
"prettier": "^3.0.3",
|
||||
"prettier-plugin-astro": "^0.12.0",
|
||||
"tiny-glob": "^0.2.9",
|
||||
"turbo": "^1.10.12",
|
||||
|
|
|
|||
|
|
@ -1,5 +1,57 @@
|
|||
# astro
|
||||
|
||||
## 3.0.12
|
||||
|
||||
### Patch Changes
|
||||
|
||||
- [#8449](https://github.com/withastro/astro/pull/8449) [`7eea37a07`](https://github.com/withastro/astro/commit/7eea37a075c6abb1de715de76d1911ff41e8ab13) Thanks [@matthewp](https://github.com/matthewp)! - Fix multi-layout head injection
|
||||
|
||||
## 3.0.11
|
||||
|
||||
### Patch Changes
|
||||
|
||||
- [#8441](https://github.com/withastro/astro/pull/8441) [`f66053a1e`](https://github.com/withastro/astro/commit/f66053a1ea0a4e3bdb0b0df12bb1bf56e1ea2618) Thanks [@martrapp](https://github.com/martrapp)! - Only transition between pages where both have ViewTransitions enabled
|
||||
|
||||
- [#8443](https://github.com/withastro/astro/pull/8443) [`0fa483283`](https://github.com/withastro/astro/commit/0fa483283e54c94f173838cd558dc0dbdd11e699) Thanks [@the-dijkstra](https://github.com/the-dijkstra)! - Fix "Cannot read properties of null" error in CLI code
|
||||
|
||||
- Updated dependencies [[`f3f62a5a2`](https://github.com/withastro/astro/commit/f3f62a5a20f4881bb04f65f192df8e1ccf7fb601)]:
|
||||
- @astrojs/markdown-remark@3.1.0
|
||||
|
||||
## 3.0.10
|
||||
|
||||
### Patch Changes
|
||||
|
||||
- [#8437](https://github.com/withastro/astro/pull/8437) [`b3cf1b327`](https://github.com/withastro/astro/commit/b3cf1b32765c76cfc90e497a68280ad52f02cb1f) Thanks [@Princesseuh](https://github.com/Princesseuh)! - Fix imports of images with uppercased file extensions not working
|
||||
|
||||
- [#8440](https://github.com/withastro/astro/pull/8440) [`b92d066b7`](https://github.com/withastro/astro/commit/b92d066b737f64f08a9cf293bd07c9263ef8f32d) Thanks [@natemoo-re](https://github.com/natemoo-re)! - Fix issue where `renderToFinalDestination` would throw in internal Astro code
|
||||
|
||||
## 3.0.9
|
||||
|
||||
### Patch Changes
|
||||
|
||||
- [#8351](https://github.com/withastro/astro/pull/8351) [`7d95bd9ba`](https://github.com/withastro/astro/commit/7d95bd9baaf755239fd7d35e4813861b2dbccf42) Thanks [@lilnasy](https://github.com/lilnasy)! - Fixed a case where dynamic imports tried to preload inlined stylesheets.
|
||||
|
||||
- [#8353](https://github.com/withastro/astro/pull/8353) [`1947ef7a9`](https://github.com/withastro/astro/commit/1947ef7a99ce3d1d6ea797842edd31d5edffa5de) Thanks [@elevatebart](https://github.com/elevatebart)! - Astro will now skip asset optimization when there is a query in the import. Instead, it will let vite deal with it using plugins.
|
||||
|
||||
```vue
|
||||
<script>
|
||||
// This will not return an optimized asset
|
||||
import Component from './Component.vue?component';
|
||||
</script>
|
||||
```
|
||||
|
||||
- [#8424](https://github.com/withastro/astro/pull/8424) [`61ad70fdc`](https://github.com/withastro/astro/commit/61ad70fdc52035964c43ecdb4cf7468f6c2b61e7) Thanks [@itsmatteomanf](https://github.com/itsmatteomanf)! - Fixes remote assets caching logic to not use expired assets
|
||||
|
||||
- [#8306](https://github.com/withastro/astro/pull/8306) [`d2f2a11cd`](https://github.com/withastro/astro/commit/d2f2a11cdb42b0de79be21c798eda8e7e7b2a277) Thanks [@jacobthesheep](https://github.com/jacobthesheep)! - Support detecting Bun when logging messages with package manager information.
|
||||
|
||||
- [#8414](https://github.com/withastro/astro/pull/8414) [`5126c6a40`](https://github.com/withastro/astro/commit/5126c6a40f88bff66ee5d3c3a21eea8c4a44ce7a) Thanks [@Princesseuh](https://github.com/Princesseuh)! - Fix missing type for `imageConfig` export from `astro:assets`
|
||||
|
||||
- [#8416](https://github.com/withastro/astro/pull/8416) [`48ff7855b`](https://github.com/withastro/astro/commit/48ff7855b238536a3df17cb29335c90029fc41a4) Thanks [@Princesseuh](https://github.com/Princesseuh)! - Installing will no longer fail when Sharp can't be installed
|
||||
|
||||
- [#8418](https://github.com/withastro/astro/pull/8418) [`923a443cb`](https://github.com/withastro/astro/commit/923a443cb060a0e936a0e1cc87c0360232f77914) Thanks [@bluwy](https://github.com/bluwy)! - Fix markdown page HMR
|
||||
|
||||
- [#8332](https://github.com/withastro/astro/pull/8332) [`8935b3b46`](https://github.com/withastro/astro/commit/8935b3b4672d6c54c7b79e6c4575298f75eeb9f4) Thanks [@martrapp](https://github.com/martrapp)! - Fix scroll position when navigating back from page w/o ViewTransitions
|
||||
|
||||
## 3.0.8
|
||||
|
||||
### Patch Changes
|
||||
|
|
|
|||
8
packages/astro/client.d.ts
vendored
8
packages/astro/client.d.ts
vendored
|
|
@ -57,17 +57,15 @@ declare module 'astro:assets' {
|
|||
Image: typeof import('./components/Image.astro').default;
|
||||
};
|
||||
|
||||
type WithRequired<T, K extends keyof T> = T & { [P in K]-?: T[P] };
|
||||
type Simplify<T> = { [KeyType in keyof T]: T[KeyType] } & {};
|
||||
type ImgAttributes = WithRequired<
|
||||
type ImgAttributes = import('./dist/type-utils.js').WithRequired<
|
||||
Omit<import('./types').HTMLAttributes<'img'>, 'src' | 'width' | 'height'>,
|
||||
'alt'
|
||||
>;
|
||||
|
||||
export type LocalImageProps = Simplify<
|
||||
export type LocalImageProps = import('./dist/type-utils.js').Simplify<
|
||||
import('./dist/assets/types.js').LocalImageProps<ImgAttributes>
|
||||
>;
|
||||
export type RemoteImageProps = Simplify<
|
||||
export type RemoteImageProps = import('./dist/type-utils.js').Simplify<
|
||||
import('./dist/assets/types.js').RemoteImageProps<ImgAttributes>
|
||||
>;
|
||||
export const { getImage, getConfiguredImageService, imageConfig, Image }: AstroAssets;
|
||||
|
|
|
|||
|
|
@ -19,7 +19,9 @@ const { fallback = 'animate' } = Astro.props as Props;
|
|||
};
|
||||
type Events = 'astro:page-load' | 'astro:after-swap';
|
||||
|
||||
const persistState = (state: State) => history.replaceState(state, '');
|
||||
// only update history entries that are managed by us
|
||||
// leave other entries alone and do not accidently add state.
|
||||
const persistState = (state: State) => history.state && history.replaceState(state, '');
|
||||
const supportsViewTransitions = !!document.startViewTransition;
|
||||
const transitionEnabledOnThisPage = () =>
|
||||
!!document.querySelector('[name="astro-view-transitions-enabled"]');
|
||||
|
|
@ -32,11 +34,13 @@ const { fallback = 'animate' } = Astro.props as Props;
|
|||
// can use that to determine popstate if going forward or back.
|
||||
let currentHistoryIndex = 0;
|
||||
if (history.state) {
|
||||
// we reloaded a page with history state (e.g. back button or browser reload)
|
||||
// we reloaded a page with history state
|
||||
// (e.g. history navigation from non-transition page or browser reload)
|
||||
currentHistoryIndex = history.state.index;
|
||||
scrollTo({ left: 0, top: history.state.scrollY });
|
||||
} else if (transitionEnabledOnThisPage()) {
|
||||
history.replaceState({ index: currentHistoryIndex, scrollY }, '');
|
||||
}
|
||||
|
||||
const throttle = (cb: (...args: any[]) => any, delay: number) => {
|
||||
let wait = false;
|
||||
// During the waiting time additional events are lost.
|
||||
|
|
@ -102,20 +106,19 @@ const { fallback = 'animate' } = Astro.props as Props;
|
|||
|
||||
function isInfinite(animation: Animation) {
|
||||
const effect = animation.effect;
|
||||
if(
|
||||
!effect ||
|
||||
!(effect instanceof KeyframeEffect) ||
|
||||
!effect.target
|
||||
) return false;
|
||||
const style = window.getComputedStyle(effect.target, effect.pseudoElement);
|
||||
return style.animationIterationCount === "infinite";
|
||||
}
|
||||
if (!effect || !(effect instanceof KeyframeEffect) || !effect.target) return false;
|
||||
const style = window.getComputedStyle(effect.target, effect.pseudoElement);
|
||||
return style.animationIterationCount === 'infinite';
|
||||
}
|
||||
|
||||
const parser = new DOMParser();
|
||||
|
||||
async function updateDOM(html: string, state?: State, fallback?: Fallback) {
|
||||
const doc = parser.parseFromString(html, 'text/html');
|
||||
// A noop element used to prevent styles from being removed
|
||||
if (import.meta.env.DEV) {
|
||||
var noopEl: string | undefined = document.createElement('div');
|
||||
}
|
||||
|
||||
async function updateDOM(doc: Document, loc: URL, state?: State, fallback?: Fallback) {
|
||||
// Check for a head element that should persist, either because it has the data
|
||||
// attribute or is a link el.
|
||||
const persistedHeadElement = (el: Element): Element | null => {
|
||||
|
|
@ -141,6 +144,18 @@ const { fallback = 'animate' } = Astro.props as Props;
|
|||
}
|
||||
}
|
||||
}
|
||||
// Only run this in dev. This will get stripped from production builds and is not needed.
|
||||
if (import.meta.env.DEV) {
|
||||
if (el.tagName === 'STYLE' && el.dataset.viteDevId) {
|
||||
const devId = el.dataset.viteDevId;
|
||||
// If this same style tag exists, remove it from the new page
|
||||
return (
|
||||
doc.querySelector(`style[data-astro-dev-id="${devId}"]`) ||
|
||||
// Otherwise, keep it anyways. This is client:only styles.
|
||||
noopEl
|
||||
);
|
||||
}
|
||||
}
|
||||
return null;
|
||||
};
|
||||
|
||||
|
|
@ -193,19 +208,17 @@ const { fallback = 'animate' } = Astro.props as Props;
|
|||
// Chromium based browsers (Chrome, Edge, Opera, ...)
|
||||
scrollTo({ left: 0, top: 0, behavior: 'instant' });
|
||||
|
||||
if (state?.scrollY === 0 && location.hash) {
|
||||
const id = decodeURIComponent(location.hash.slice(1));
|
||||
let initialScrollY = 0;
|
||||
if (!state && loc.hash) {
|
||||
const id = decodeURIComponent(loc.hash.slice(1));
|
||||
const elem = document.getElementById(id);
|
||||
// prefer scrollIntoView() over scrollTo() because it takes scroll-padding into account
|
||||
if (elem) {
|
||||
state.scrollY = elem.offsetTop;
|
||||
persistState(state); // first guess, later updated by scroll handler
|
||||
elem.scrollIntoView(); // for Firefox, this should better be {behavior: 'instant'}
|
||||
}
|
||||
elem && (initialScrollY = elem.offsetTop) && elem.scrollIntoView();
|
||||
} else if (state && state.scrollY !== 0) {
|
||||
scrollTo(0, state.scrollY); // usings default scrollBehavior
|
||||
}
|
||||
|
||||
!state &&
|
||||
history.pushState({ index: ++currentHistoryIndex, scrollY: initialScrollY }, '', loc.href);
|
||||
triggerEvent('astro:after-swap');
|
||||
};
|
||||
|
||||
|
|
@ -236,8 +249,10 @@ const { fallback = 'animate' } = Astro.props as Props;
|
|||
// Trigger the animations
|
||||
const currentAnimations = document.getAnimations();
|
||||
document.documentElement.dataset.astroTransitionFallback = 'old';
|
||||
const newAnimations = document.getAnimations().filter(a => !currentAnimations.includes(a) && !isInfinite(a));
|
||||
const finished = Promise.all(newAnimations.map(a => a.finished));
|
||||
const newAnimations = document
|
||||
.getAnimations()
|
||||
.filter((a) => !currentAnimations.includes(a) && !isInfinite(a));
|
||||
const finished = Promise.all(newAnimations.map((a) => a.finished));
|
||||
const fallbackSwap = () => {
|
||||
swap();
|
||||
document.documentElement.dataset.astroTransitionFallback = 'new';
|
||||
|
|
@ -249,19 +264,29 @@ const { fallback = 'animate' } = Astro.props as Props;
|
|||
}
|
||||
}
|
||||
|
||||
async function navigate(dir: Direction, href: string, state?: State) {
|
||||
async function navigate(dir: Direction, loc: URL, state?: State) {
|
||||
let finished: Promise<void>;
|
||||
const href = loc.href;
|
||||
const { html, ok } = await getHTML(href);
|
||||
// If there is a problem fetching the new page, just do an MPA navigation to it.
|
||||
if (!ok) {
|
||||
location.href = href;
|
||||
return;
|
||||
}
|
||||
const doc = parser.parseFromString(html, 'text/html');
|
||||
if (!doc.querySelector('[name="astro-view-transitions-enabled"]')) {
|
||||
location.href = href;
|
||||
return;
|
||||
}
|
||||
|
||||
// Now we are sure that we will push state, and it is time to create a state if it is still missing.
|
||||
!state && history.replaceState({ index: currentHistoryIndex, scrollY }, '');
|
||||
|
||||
document.documentElement.dataset.astroTransition = dir;
|
||||
if (supportsViewTransitions) {
|
||||
finished = document.startViewTransition(() => updateDOM(html, state)).finished;
|
||||
finished = document.startViewTransition(() => updateDOM(doc, loc, state)).finished;
|
||||
} else {
|
||||
finished = updateDOM(html, state, getFallback());
|
||||
finished = updateDOM(doc, loc, state, getFallback());
|
||||
}
|
||||
try {
|
||||
await finished;
|
||||
|
|
@ -313,11 +338,11 @@ const { fallback = 'animate' } = Astro.props as Props;
|
|||
ev.shiftKey || // new window
|
||||
ev.defaultPrevented ||
|
||||
!transitionEnabledOnThisPage()
|
||||
)
|
||||
) {
|
||||
// No page transitions in these cases,
|
||||
// Let the browser standard action handle this
|
||||
return;
|
||||
|
||||
}
|
||||
// We do not need to handle same page links because there are no page transitions
|
||||
// Same page means same path and same query params (but different hash)
|
||||
if (location.pathname === link.pathname && location.search === link.search) {
|
||||
|
|
@ -330,31 +355,29 @@ const { fallback = 'animate' } = Astro.props as Props;
|
|||
// But we want to handle it like any other same page navigation
|
||||
// So we scroll to the top of the page but do not start page transitions
|
||||
ev.preventDefault();
|
||||
persistState({ ...history.state, scrollY });
|
||||
scrollTo({ left: 0, top: 0, behavior: 'instant' });
|
||||
// push state on the first navigation but not if we were here already
|
||||
if (location.hash) {
|
||||
// last target was different
|
||||
history.replaceState({ index: currentHistoryIndex, scrollY: -(scrollY + 1) }, '');
|
||||
const newState: State = { index: ++currentHistoryIndex, scrollY: 0 };
|
||||
history.pushState(newState, '', link.href);
|
||||
}
|
||||
scrollTo({ left: 0, top: 0, behavior: 'instant' });
|
||||
return;
|
||||
}
|
||||
}
|
||||
|
||||
// these are the cases we will handle: same origin, different page
|
||||
ev.preventDefault();
|
||||
navigate('forward', link.href, { index: ++currentHistoryIndex, scrollY: 0 });
|
||||
const newState: State = { index: currentHistoryIndex, scrollY };
|
||||
persistState({ index: currentHistoryIndex - 1, scrollY });
|
||||
history.pushState(newState, '', link.href);
|
||||
navigate('forward', new URL(link.href));
|
||||
});
|
||||
|
||||
addEventListener('popstate', (ev) => {
|
||||
if (!transitionEnabledOnThisPage() && ev.state) {
|
||||
// The current page doesn't haven't View Transitions,
|
||||
// respect that with a full page reload
|
||||
// -- but only for transition managed by us (ev.state is set)
|
||||
history.scrollRestoration && (history.scrollRestoration = "manual")
|
||||
// The current page doesn't have View Transitions enabled
|
||||
// but the page we navigate to does (because it set the state).
|
||||
// Do a full page refresh to reload the client-side router from the new page.
|
||||
// Scroll restauration will then happen during the reload when the router's code is re-executed
|
||||
history.scrollRestoration && (history.scrollRestoration = 'manual');
|
||||
location.reload();
|
||||
return;
|
||||
}
|
||||
|
|
@ -365,7 +388,7 @@ const { fallback = 'animate' } = Astro.props as Props;
|
|||
// The browser will handle navigation fine without our help
|
||||
if (ev.state === null) {
|
||||
if (history.scrollRestoration) {
|
||||
history.scrollRestoration = "auto";
|
||||
history.scrollRestoration = 'auto';
|
||||
}
|
||||
return;
|
||||
}
|
||||
|
|
@ -373,14 +396,18 @@ const { fallback = 'animate' } = Astro.props as Props;
|
|||
// With the default "auto", the browser will jump to the old scroll position
|
||||
// before the ViewTransition is complete.
|
||||
if (history.scrollRestoration) {
|
||||
history.scrollRestoration = "manual";
|
||||
history.scrollRestoration = 'manual';
|
||||
}
|
||||
|
||||
const state: State | undefined = history.state;
|
||||
const nextIndex = state?.index ?? currentHistoryIndex + 1;
|
||||
const state: State = history.state;
|
||||
const nextIndex = state.index;
|
||||
const direction: Direction = nextIndex > currentHistoryIndex ? 'forward' : 'back';
|
||||
navigate(direction, location.href, state);
|
||||
currentHistoryIndex = nextIndex;
|
||||
if (state.scrollY < 0) {
|
||||
scrollTo(0, -(state.scrollY + 1));
|
||||
} else {
|
||||
navigate(direction, new URL(location.href), state);
|
||||
}
|
||||
});
|
||||
|
||||
['mouseenter', 'touchstart', 'focus'].forEach((evName) => {
|
||||
|
|
@ -404,13 +431,10 @@ const { fallback = 'animate' } = Astro.props as Props;
|
|||
addEventListener('load', onPageLoad);
|
||||
// There's not a good way to record scroll position before a back button.
|
||||
// So the way we do it is by listening to scrollend if supported, and if not continuously record the scroll position.
|
||||
const updateState = () => {
|
||||
// only update history entries that are managed by us
|
||||
// leave other entries alone and do not accidently add state.
|
||||
if (history.state) {
|
||||
persistState({ ...history.state, scrollY });
|
||||
}
|
||||
}
|
||||
const updateState = () => {
|
||||
persistState({ ...history.state, scrollY });
|
||||
};
|
||||
|
||||
if ('onscrollend' in window) addEventListener('scrollend', updateState);
|
||||
else addEventListener('scroll', throttle(updateState, 300));
|
||||
}
|
||||
|
|
|
|||
|
|
@ -0,0 +1,10 @@
|
|||
---
|
||||
import Layout from '../components/Layout.astro';
|
||||
import Island from '../components/Island';
|
||||
---
|
||||
<Layout>
|
||||
<a id="click-two" href="/client-only-two">go to page 2</a>
|
||||
<div transition:persist="island">
|
||||
<Island client:only count={5}>message here</Island>
|
||||
</div>
|
||||
</Layout>
|
||||
|
|
@ -0,0 +1,10 @@
|
|||
---
|
||||
import Layout from '../components/Layout.astro';
|
||||
import Island from '../components/Island';
|
||||
---
|
||||
<Layout>
|
||||
<p id="page-two">Page 2</p>
|
||||
<div transition:persist="island">
|
||||
<Island client:only count={5}>message here</Island>
|
||||
</div>
|
||||
</Layout>
|
||||
Some files were not shown because too many files have changed in this diff Show more
Loading…
Reference in a new issue