Skip to content

Build Offline Package

WARNING

For offline packages, the routing mode must be set to Hash mode, otherwise the widget package will not work properly.

1. Configure Routing to Hash Mode

In the vue-router routing configuration file, set createWebHashHistory() to enable the Hash routing mode:

js
const router = createRouter({
  history: createWebHashHistory(import.meta.env.BASE_URL), // 👈 Enable Hash routing mode
  routes: [
  ],
})

2. Set Widget Package Hash Routing

In the widget.package.ts file in the root directory, set hash to true:

ts
export default new WidgetPackage({
  author: 'Neo Fu',
  description: {
    'zh-CN': 'Clock Widget',
    'en-US': 'Clocks',
  },
  version: '1.0.0',
  hash: true, // 👈 Enable Hash routing
  // ...other configurations
})

3. Compile and Package Offline

Run the following command in the project root directory to package it offline:

shell
npm run build:offline

After packaging is complete, the following will be generated in the dist directory:

  • widget.json: Widget package metadata (including basic info, routing, etc.)
  • widget.zip: Widget package compressed file (containing all code and resources)

4. Install Offline Widget Package

Drag and drop widget.zip into the Search Interface to complete the offline installation.