0
Fork 0
mirror of https://github.com/withastro/astro.git synced 2024-12-30 22:03:56 -05:00

fix: use assetsDir in creating vite config (#10732)

Co-authored-by: Emanuele Stoppa <my.burning@gmail.com>
This commit is contained in:
Rishi Raj Jain 2024-04-16 18:53:50 +05:30 committed by GitHub
parent 90669472df
commit a92e263beb
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
14 changed files with 150 additions and 0 deletions

View file

@ -0,0 +1,5 @@
---
"astro": patch
---
Correctly sets `build.assets` directory during `vite` config setup

View file

@ -208,6 +208,7 @@ export async function createVite(
noExternal: [...ALWAYS_NOEXTERNAL, ...astroPkgsConfig.ssr.noExternal],
external: [...(mode === 'dev' ? ONLY_DEV_EXTERNAL : []), ...astroPkgsConfig.ssr.external],
},
build: { assetsDir: settings.config.build.assets },
};
// If the user provides a custom assets prefix, make sure assets handled by Vite

View file

@ -0,0 +1,36 @@
import assert from 'node:assert/strict';
import { before, describe, it } from 'node:test';
import { loadFixture } from './test-utils.js';
describe('assets dir takes the URL path inside the output directory', () => {
/** @type {URL} */
let checkDir;
before(async () => {
const fixture = await loadFixture({
root: './fixtures/astro-assets-dir/',
build: {
assets: 'custom_dir_1',
},
integrations: [
{
name: '@astrojs/dir',
hooks: {
'astro:build:done': ({ dir }) => {
checkDir = dir;
},
},
},
],
});
await fixture.build();
});
it('generates the assets directory as per build.assets configuration', async () => {
const removeTrailingSlash = (str) => str.replace(/\/$/, '');
assert.equal(
removeTrailingSlash(new URL('./custom_dir_1', checkDir).toString()),
removeTrailingSlash(
new URL('./fixtures/astro-assets-dir/dist/custom_dir_1', import.meta.url).toString()
)
);
});
});

View file

@ -0,0 +1,7 @@
import react from '@astrojs/react';
import { defineConfig } from 'astro/config';
// https://astro.build/config
export default defineConfig({
integrations: [react()],
});

View file

@ -0,0 +1,11 @@
{
"name": "@test/astro-assets-dir",
"version": "0.0.0",
"private": true,
"dependencies": {
"@astrojs/react": "workspace:*",
"astro": "workspace:*",
"react": "^18.2.0",
"react-dom": "^18.2.0"
}
}

Binary file not shown.

After

Width:  |  Height:  |  Size: 11 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 11 KiB

View file

@ -0,0 +1,11 @@
import React, { useState } from 'react';
export default function Counter() {
const [count, setCount] = useState(0);
return (
<div>
<div>Count: {count}</div>
<button type="button" onClick={() => setCount(count+1)}>Increment</button>
</div>
);
}

View file

@ -0,0 +1,6 @@
---
title: My Post
cover: ../../assets/penguin1.jpg
---
Hello world

View file

@ -0,0 +1,12 @@
import { defineCollection, z } from "astro:content";
const blogCollection = defineCollection({
schema: ({image}) => z.object({
title: z.string(),
cover: image(),
}),
});
export const collections = {
blog: blogCollection,
};

View file

@ -0,0 +1,16 @@
---
import { Image } from "astro:assets";
import { getCollection } from "astro:content";
const allBlogPosts = await getCollection("blog");
---
{
allBlogPosts.map((post) => (
<div>
<Image src={post.data.cover} alt="cover" width="100" height="100" />
<h2>
<a href={"/blog/" + post.slug}>{post.data.title}</a>
</h2>
</div>
))
}

View file

@ -0,0 +1,23 @@
---
import { Image } from 'astro:assets'
import p1Image from '../assets/penguin1.jpg';
import Counter from '../components/Counter.jsx';
---
<html lang="en">
<head>
<title>Assets Prefix</title>
</head>
<body>
<h1>I am red</h1>
<img id="image-asset" src={p1Image.src} width={p1Image.width} height={p1Image.height} alt="penguin" />
<Image src={p1Image} alt="penguin" />
<Counter client:load />
<p id="assets-prefix-env">{typeof import.meta.env.ASSETS_PREFIX === 'string' ? import.meta.env.ASSETS_PREFIX : JSON.stringify(import.meta.env.ASSETS_PREFIX)}</p>
<style>
h1 {
color: red;
}
</style>
</body>
</html>

View file

@ -0,0 +1,7 @@
# Assets Prefix
Relative image has assetsPrefix
![Relative image](../assets/penguin1.jpg)
![non-UTF-8 file name image](../assets/ペンギン.jpg)

View file

@ -1800,6 +1800,21 @@ importers:
specifier: workspace:*
version: link:../../..
packages/astro/test/fixtures/astro-assets-dir:
dependencies:
'@astrojs/react':
specifier: workspace:*
version: link:../../../../integrations/react
astro:
specifier: workspace:*
version: link:../../..
react:
specifier: ^18.2.0
version: 18.2.0
react-dom:
specifier: ^18.2.0
version: 18.2.0(react@18.2.0)
packages/astro/test/fixtures/astro-assets-prefix:
dependencies:
'@astrojs/react':