Skip to content

Commit

Permalink
fix: OGImage will not generate at dev mode
Browse files Browse the repository at this point in the history
  • Loading branch information
j36426052 committed Jun 5, 2024
1 parent 34650a5 commit 5743cf5
Show file tree
Hide file tree
Showing 2 changed files with 13 additions and 9 deletions.
18 changes: 11 additions & 7 deletions scripts/pre-build/generateOGImage.ts
Original file line number Diff line number Diff line change
Expand Up @@ -47,11 +47,17 @@ interface SomethingById {
[id: string]: string;
}

export default async function generateOGImage(){
export default function generateOGImage(command: string) {
return {
name: 'vite-plugin-generate-og-images',
async buildStart() {
console.log('Start OG generating');
console.log(command);
if (command == 'serve') {
console.log('Skipping OG image generation in development mode.');
return;
}

console.log('Start OG generating');
registerFont(path.resolve(__dirname, '../../src/assets/fonts/TaipeiSansTCBeta-Bold/TaipeiSansTCBeta-Bold.ttf'), { family: 'TaipeiSansTCBeta-Bold' });
// reading session.json
const sessionsData: { sessions: Session[] } = JSON.parse(fs.readFileSync('./src/assets/json/session.json', 'utf-8'));
Expand All @@ -70,7 +76,7 @@ export default async function generateOGImage(){

// generate image
for (const session of sessionsData.sessions) {
await generateSessionImage(session,typeById,nameById);
await generateSessionImage(session, typeById, nameById);
}

console.log('All OG images have been generated.');
Expand Down Expand Up @@ -132,8 +138,7 @@ function drawTag(ctx: CanvasRenderingContext2D, tag: string, x: number, y: numbe
return x + rectWidth + 15;
}


async function generateSessionImage(session: Session,typeById: SomethingById,nameById: SomethingById): Promise<void> {
async function generateSessionImage(session: Session, typeById: SomethingById, nameById: SomethingById): Promise<void> {
const dirPath = path.resolve(__dirname, '../../public/images/sessions');
// Check if the directory exists, if not, create it
if (!fs.existsSync(dirPath)) {
Expand All @@ -152,7 +157,7 @@ async function generateSessionImage(session: Session,typeById: SomethingById,nam
const canvasWidth = 1200;
const canvasHeight = 630;
const canvas = createCanvas(canvasWidth, canvasHeight);
const ctx = canvas.getContext('2d') ;
const ctx = canvas.getContext('2d');
// set background image
const background = await loadImage('./src/assets/images/og_background.jpg');
ctx.drawImage(background, 0, 0, canvasWidth, canvasHeight);
Expand Down Expand Up @@ -192,4 +197,3 @@ async function generateSessionImage(session: Session,typeById: SomethingById,nam
fs.writeFileSync(outputPath, buffer);
console.log(`Generated image for session ${session.id} at ${outputPath}`);
}

4 changes: 2 additions & 2 deletions vite.config.ts
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@ import Components from 'unplugin-vue-components/vite'
import ViteIcons from 'unplugin-icons/vite'
import IconsResolver from 'unplugin-icons/resolver'
import { VitePWA } from 'vite-plugin-pwa'
import generateOGImage from './scripts/pre-build/generateOGImage'
import generateOGImage from './scripts/pre-build/generateOGImage'

export default defineConfig(({ mode, command }) => {
const parsed = loadEnv(mode, process.cwd())
Expand Down Expand Up @@ -145,7 +145,7 @@ export default defineConfig(({ mode, command }) => {
: []
}
}),
generateOGImage()
generateOGImage(command)
],
ssgOptions: {
script: 'async',
Expand Down

0 comments on commit 5743cf5

Please sign in to comment.