Allow importing Image component from @astrojs/image

This commit is contained in:
unknown 2022-07-07 12:23:25 -04:00
parent 568960f175
commit 86b6e4bfb8
5 changed files with 13 additions and 6 deletions

View file

@ -111,6 +111,7 @@ export async function createVite(
replacement: fileURLToPath(new URL('../@types/astro', import.meta.url)), replacement: fileURLToPath(new URL('../@types/astro', import.meta.url)),
}, },
], ],
conditions: ['astro'],
}, },
// Note: SSR API is in beta (https://vitejs.dev/guide/ssr.html) // Note: SSR API is in beta (https://vitejs.dev/guide/ssr.html)
ssr: { ssr: {
@ -129,6 +130,7 @@ export async function createVite(
result = vite.mergeConfig(result, astroConfig.vite || {}); result = vite.mergeConfig(result, astroConfig.vite || {});
result = vite.mergeConfig(result, commandConfig); result = vite.mergeConfig(result, commandConfig);
sortPlugins(result); sortPlugins(result);
return result; return result;
} }

View file

@ -109,7 +109,7 @@ export default {
```html ```html
--- ---
import { Image } from '@astrojs/image/components'; import { Image } from '@astrojs/image';
import heroImage from '../assets/hero.png'; import heroImage from '../assets/hero.png';
--- ---
@ -136,7 +136,7 @@ import heroImage from '../assets/hero.png';
```html ```html
--- ---
import { Image } from '@astrojs/image/components'; import { Image } from '@astrojs/image';
const imageUrl = 'https://www.google.com/images/branding/googlelogo/2x/googlelogo_color_272x92dp.png'; const imageUrl = 'https://www.google.com/images/branding/googlelogo/2x/googlelogo_color_272x92dp.png';
--- ---
@ -162,7 +162,7 @@ const imageUrl = 'https://www.google.com/images/branding/googlelogo/2x/googlelog
```html ```html
--- ---
setup: | setup: |
import { Image } from '@astrojs/image/components' import { Image } from '@astrojs/image'
import hero from '../../assets/blog/introducing-astro.jpg' import hero from '../../assets/blog/introducing-astro.jpg'
title: Hello world! title: Hello world!
publishDate: 12 Sep 2021 publishDate: 12 Sep 2021

View file

@ -19,7 +19,10 @@
"bugs": "https://github.com/withastro/astro/issues", "bugs": "https://github.com/withastro/astro/issues",
"homepage": "https://astro.build", "homepage": "https://astro.build",
"exports": { "exports": {
".": "./dist/index.js", ".": {
"astro": "./components/index.js",
"import": "./dist/index.js"
},
"./sharp": "./dist/loaders/sharp.js", "./sharp": "./dist/loaders/sharp.js",
"./endpoints/dev": "./dist/endpoints/dev.js", "./endpoints/dev": "./dist/endpoints/dev.js",
"./endpoints/prod": "./dist/endpoints/prod.js", "./endpoints/prod": "./dist/endpoints/prod.js",

View file

@ -1,6 +1,6 @@
--- ---
import socialJpg from '../assets/social.jpg'; import socialJpg from '../assets/social.jpg';
import { Image } from '@astrojs/image/components'; import { Image } from '@astrojs/image';
--- ---
<html> <html>

View file

@ -2,6 +2,7 @@ import { expect } from 'chai';
import * as cheerio from 'cheerio'; import * as cheerio from 'cheerio';
import path from 'path'; import path from 'path';
import sizeOf from 'image-size'; import sizeOf from 'image-size';
import { fileURLToPath } from 'url';
import { loadFixture } from './test-utils.js'; import { loadFixture } from './test-utils.js';
let fixture; let fixture;
@ -12,7 +13,8 @@ describe('SSG images', function () {
}); });
function verifyImage(pathname, expected) { function verifyImage(pathname, expected) {
const dist = path.join('test/fixtures/basic-image/dist', pathname); const url = new URL('./fixtures/basic-image/dist/' + pathname, import.meta.url);
const dist = fileURLToPath(url);
const result = sizeOf(dist); const result = sizeOf(dist);
expect(result).to.deep.equal(expected); expect(result).to.deep.equal(expected);
} }