Error configuring Experimental SVG components
Closed this issue · 2 comments
cworld1 commented
Astro Info
Astro v5.0.3
Node v23.3.0
System Windows (x64)
Package Manager bun
Output static
Adapter none
Integrations none
If this issue only occurs in one browser, which browser is a problem?
No response
Describe the Bug
Problem:
Type 'true' has no properties in common with type '{ mode?: SvgRenderMode | undefined; }'.ts(2559)
(property) svg?: {
mode?: SvgRenderMode;
} | undefined
Refer to code at astro/dist/types/public/config.d.ts:
/**
*
* @name experimental.svg
* @type {boolean|object}
* @default `undefined`
* @version 5.x
* @description
*
* This feature allows you to import SVG files directly into your Astro project. By default, Astro will inline the SVG content into your HTML output.
*
* To enable this feature, set `experimental.svg` to `true` in your Astro config:
*
* ```js
* {
* experimental: {
* svg: true,
* },
* }
* ```
*
* To use this feature, import an SVG file in your Astro project, passing any common SVG attributes to the imported component.
* Astro also provides a `size` attribute to set equal `height` and `width` properties:
*
* ```astro
* ---
* import Logo from './path/to/svg/file.svg';
* ---
*
* <Logo size={24} />
* ```
*
* For a complete overview, and to give feedback on this experimental API,
* see the [Feature RFC](https://github.com/withastro/roadmap/pull/1035).
*/
svg?: {
/**
*
* @name experimental.svg.mode
* @type {string}
* @default 'inline'
*
* The default technique for handling imported SVG files. Astro will inline the SVG content into your HTML output if not specified.
*
* - `inline`: Astro will inline the SVG content into your HTML output.
* - `sprite`: Astro will generate a sprite sheet with all imported SVG files.
*
* ```astro
* ---
* import Logo from './path/to/svg/file.svg';
* ---
*
* <Logo size={24} mode="sprite" />
* ```
*/
mode?: SvgRenderMode;
};
};It shows the config can only set value like:
experimental: {
svg: {
mode: 'sprite'
}
}Which is incorrect with the decleration or documention.
What's the expected result?
experimental: {
svg: true
}Link to Minimal Reproducible Example
It is about the source code.
Participation
- I am willing to submit a pull request for this issue.