Sveltepress

পরিচিতি

এই ফিচারটি @vite-pwa/sveltekit থেকে নেয়া।

থিম ডিফল্টে pwa পাঠিয়ে দিয়ে pwa ব্যবহার করা যাবে। অপশঙ্গুলো হুবহু SvelteKit PWA Plugin Options এর মতই, শুধু darkManifest বাদে, যা হচ্ছে ডার্ক থিমে ব্যবহারের জন্য manifest path

এবং svelte.config.js -এ files.serviceWorker কনফিগ করতে হবে, SERVICE_WORKER_PATH ব্যবহার করুন যা @sveltepress/theme-default থেকে এক্সপোর্ট করা হয়।

svelte.config.js
+
+
+
+
import function adapter(options?: AdapterOptions): Adapteradapter from '@sveltejs/adapter-static'
import { function vitePreprocess(opts?: VitePreprocessOptions): PreprocessorGroupvitePreprocess } from '@sveltejs/vite-plugin-svelte'

import { const SERVICE_WORKER_PATH: stringSERVICE_WORKER_PATH } from '@sveltepress/theme-default' 

/** @type {import('@sveltejs/kit').Config} */
const 

const config: {
    extensions: string[];
    preprocess: PreprocessorGroup[];
    kit: {
        adapter: Adapter;
        files: {
            serviceWorker: string;
        };
    };
}
@type{import('@sveltejs/kit').Config}
config = {
  extensions: string[]extensions: ['.svelte', '.md'],
  preprocess: PreprocessorGroup[]preprocess: [function vitePreprocess(opts?: VitePreprocessOptions): PreprocessorGroupvitePreprocess()],
  

kit: {
    adapter: Adapter;
    files: {
        serviceWorker: string;
    };
}
kit: {
    adapter: Adapteradapter: function adapter(options?: AdapterOptions): Adapteradapter(),
    

files: {
    serviceWorker: string;
}
files: { 
      serviceWorker: stringserviceWorker: const SERVICE_WORKER_PATH: stringSERVICE_WORKER_PATH, 
    }, 
  },
}

export default 

const config: {
    extensions: string[];
    preprocess: PreprocessorGroup[];
    kit: {
        adapter: Adapter;
        files: {
            serviceWorker: string;
        };
    };
}
@type{import('@sveltejs/kit').Config}
config
ts
প্যাকেজ আবশ্যক

যদি আপনি pwa চালু করতে চান। আপনার Vite project এ dev dependency হিসেবে workbox-window যুক্ত করতে হবে

কনফিগের উদাহরণ

এই সাইটের কনফিগ উদাহরণ হিসেবে দেখুন:

export default {
  scope: stringscope: '/',
  base: stringbase: '/',
  strategies: stringstrategies: 'generateSW',
  

kit: {
    trailingSlash: string;
}
kit: {
    trailingSlash: stringtrailingSlash: 'always',
  },
  darkManifest: stringdarkManifest: '/manifest-dark.webmanifest',
  

manifest: {
    start_url: string;
    scope: string;
    name: string;
    short_name: string;
    icons: {
        src: string;
        sizes: string;
        type: string;
    }[];
    theme_color: string;
    background_color: string;
    display: string;
}
manifest: {
    start_url: stringstart_url: '/',
    scope: stringscope: '/',
    name: stringname: 'Sveltepress',
    short_name: stringshort_name: 'Sveltepress',
    

icons: {
    src: string;
    sizes: string;
    type: string;
}[]
icons: [
      {
        src: stringsrc: '/android-chrome-192x192.png',
        sizes: stringsizes: '192x192',
        type: stringtype: 'image/png',
      },
      {
        src: stringsrc: '/android-chrome-512x512.png',
        sizes: stringsizes: '512x512',
        type: stringtype: 'image/png',
      },
    ],
    theme_color: stringtheme_color: '#f2f2f2',
    background_color: stringbackground_color: '#f2f2f2',
    display: stringdisplay: 'standalone',
  },
} as any
ts
Expand code