quicklook-kit 0.1.0 → 0.1.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/package.json +14 -1
- package/readme.markdown +54 -47
package/package.json
CHANGED
|
@@ -1,8 +1,21 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "quicklook-kit",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.1",
|
|
4
4
|
"description": "Build macOS QuickLook previews with any Vite-based web framework",
|
|
5
5
|
"license": "MIT",
|
|
6
|
+
"keywords": [
|
|
7
|
+
"quicklook",
|
|
8
|
+
"quicklook-plugin",
|
|
9
|
+
"sveltekit",
|
|
10
|
+
"svelte",
|
|
11
|
+
"astro",
|
|
12
|
+
"solid",
|
|
13
|
+
"solid-start",
|
|
14
|
+
"vue",
|
|
15
|
+
"nuxt",
|
|
16
|
+
"angular",
|
|
17
|
+
"analog"
|
|
18
|
+
],
|
|
6
19
|
"type": "module",
|
|
7
20
|
"bin": {
|
|
8
21
|
"quicklook": "./src/cli.ts"
|
package/readme.markdown
CHANGED
|
@@ -1,5 +1,9 @@
|
|
|
1
1
|
# quicklook-kit
|
|
2
2
|
|
|
3
|
+
|
|
4
|
+
[](https://www.npmjs.org/package/quicklook-kit)
|
|
5
|
+
[](https://github.com/idleberg/quicklook-kit/actions)
|
|
6
|
+
|
|
3
7
|
> Build macOS QuickLook previews with any Vite-based web framework, no Swift required
|
|
4
8
|
|
|
5
9
|
Your preview is a web page. quicklook-kit builds it with your framework, wraps it in a small native QuickLook extension and installs the resulting app. You never touch Swift or Xcode.
|
|
@@ -27,30 +31,30 @@ To start from scratch, use one of the [templates](https://github.com/idleberg/qu
|
|
|
27
31
|
Create `quicklook.config.ts` in your project root:
|
|
28
32
|
|
|
29
33
|
```ts
|
|
30
|
-
import { defineConfig } from
|
|
34
|
+
import { defineConfig } from "quicklook-kit";
|
|
31
35
|
|
|
32
36
|
export default defineConfig({
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
37
|
+
name: "Example Preview",
|
|
38
|
+
bundleId: "com.example.ExamplePreview",
|
|
39
|
+
types: [
|
|
40
|
+
{
|
|
41
|
+
id: "com.example.ExamplePreview.example",
|
|
42
|
+
description: "Example File",
|
|
43
|
+
extensions: ["example"],
|
|
44
|
+
conformsTo: ["public.plain-text"],
|
|
45
|
+
},
|
|
46
|
+
],
|
|
47
|
+
framework: "sveltekit",
|
|
44
48
|
});
|
|
45
49
|
```
|
|
46
50
|
|
|
47
|
-
To preview a type macOS already knows about, use a plain string like `'public.json'` in place of an object.
|
|
51
|
+
A new type conforms to `public.plain-text` for text formats, or `public.data` for binary ones. To preview a type macOS already knows about, use a plain string like `'public.json'` in place of an object.
|
|
48
52
|
|
|
49
53
|
The config can also be `quicklook.config.js`, `.json`, `.yaml` or `.toml`, or a `.quicklookrc`. The keys are the same in every format.
|
|
50
54
|
|
|
51
55
|
| Key | Default | |
|
|
52
56
|
| -------------- | ------------ | ---------------------------------------------------------------------------------- |
|
|
53
|
-
| `name` | required | App name
|
|
57
|
+
| `name` | required | App name, shown in Finder and System Settings |
|
|
54
58
|
| `bundleId` | required | The extension gets `<bundleId>.Extension` |
|
|
55
59
|
| `types` | required | File types to preview |
|
|
56
60
|
| `framework` | required | `'sveltekit'`, `'astro'`, `'solid-start'`, `'nuxt'`, `'analog'`, or an integration |
|
|
@@ -66,16 +70,16 @@ Each framework needs a static, client-side build:
|
|
|
66
70
|
|
|
67
71
|
| Framework | Requirement |
|
|
68
72
|
| ---------- | ------------------------------------------------------ |
|
|
69
|
-
|
|
|
73
|
+
| Analog | `@analogjs/vite-plugin-angular` |
|
|
70
74
|
| Astro | the default `output: 'static'` |
|
|
71
|
-
| SolidStart | `ssr: false`, Nitro's `static` preset prerendering `/` |
|
|
72
75
|
| Nuxt | `ssr: false` |
|
|
73
|
-
|
|
|
76
|
+
| SolidStart | `ssr: false`, Nitro's `static` preset prerendering `/` |
|
|
77
|
+
| SvelteKit | `@sveltejs/adapter-static` |
|
|
74
78
|
|
|
75
79
|
### 2. Add the Vite plugin
|
|
76
80
|
|
|
77
81
|
```ts
|
|
78
|
-
import { quicklook } from
|
|
82
|
+
import { quicklook } from "quicklook-kit/vite";
|
|
79
83
|
|
|
80
84
|
// in the framework's Vite config
|
|
81
85
|
plugins: [quicklook()];
|
|
@@ -92,7 +96,7 @@ or in `tsconfig.json` under `compilerOptions.types` as `"quicklook-kit/virtual"`
|
|
|
92
96
|
### 3. Read the file
|
|
93
97
|
|
|
94
98
|
```ts
|
|
95
|
-
import { browserFile, config, nativeFile } from
|
|
99
|
+
import { browserFile, config, nativeFile } from "virtual:quicklook";
|
|
96
100
|
|
|
97
101
|
const file = nativeFile(); // the previewed file inside QuickLook, undefined in the browser
|
|
98
102
|
config.public; // values from quicklook.config.*
|
|
@@ -112,24 +116,24 @@ In the dev server, `nativeFile()` returns `undefined`. Pass a dropped or picked
|
|
|
112
116
|
|
|
113
117
|
```json
|
|
114
118
|
{
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
119
|
+
"scripts": {
|
|
120
|
+
"dev": "quicklook dev",
|
|
121
|
+
"build": "quicklook build",
|
|
122
|
+
"register": "quicklook build && quicklook register",
|
|
123
|
+
"unregister": "quicklook unregister"
|
|
124
|
+
}
|
|
121
125
|
}
|
|
122
126
|
```
|
|
123
127
|
|
|
124
128
|
## CLI
|
|
125
129
|
|
|
126
|
-
| Command | Description
|
|
127
|
-
| ---------------------- |
|
|
128
|
-
| `quicklook dev` | Starts the framework's dev server
|
|
129
|
-
| `quicklook build:web` | Builds the page only, into `.quicklook/web`
|
|
130
|
-
| `quicklook build` | Builds the app with its extension into `.quicklook/build`
|
|
131
|
-
| `quicklook register` | Copies the built app to `/Applications` and registers the extension
|
|
132
|
-
| `quicklook unregister` | Removes the app from `/Applications`
|
|
130
|
+
| Command | Description |
|
|
131
|
+
| ---------------------- | ------------------------------------------------------------------- |
|
|
132
|
+
| `quicklook dev` | Starts the framework's dev server |
|
|
133
|
+
| `quicklook build:web` | Builds the page only, into `.quicklook/web` |
|
|
134
|
+
| `quicklook build` | Builds the app with its extension into `.quicklook/build` |
|
|
135
|
+
| `quicklook register` | Copies the built app to `/Applications` and registers the extension |
|
|
136
|
+
| `quicklook unregister` | Removes the app from `/Applications` |
|
|
133
137
|
|
|
134
138
|
After `register`, select a file in Finder and press Space. Run `build` and `register` again after every change.
|
|
135
139
|
|
|
@@ -150,22 +154,25 @@ Add `.quicklook` to your `.gitignore`.
|
|
|
150
154
|
An integration is an object with a `name` and any of these hooks. They run in order: the framework first, then each entry in `integrations`.
|
|
151
155
|
|
|
152
156
|
```ts
|
|
153
|
-
import type { Integration } from
|
|
157
|
+
import type { Integration } from "quicklook-kit";
|
|
154
158
|
|
|
155
159
|
export default (options: { key: string }): Integration => ({
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
160
|
+
name: "my-integration",
|
|
161
|
+
hooks: {
|
|
162
|
+
// Adjust the resolved config.
|
|
163
|
+
"config:resolved"(config) {},
|
|
164
|
+
|
|
165
|
+
// Post-process the framework's static output before it's bundled.
|
|
166
|
+
async "build:done"({ outDir, config }) {},
|
|
167
|
+
|
|
168
|
+
// Edit the generated XcodeGen spec: Info.plist keys, entitlements, targets.
|
|
169
|
+
"xcode:spec"(spec, config) {
|
|
170
|
+
spec.targets.ExamplePreviewExtension.info.properties.MyKey = options.key;
|
|
171
|
+
},
|
|
172
|
+
|
|
173
|
+
// Add Vite plugins wherever quicklook() is used.
|
|
174
|
+
vite: () => [],
|
|
175
|
+
},
|
|
169
176
|
});
|
|
170
177
|
```
|
|
171
178
|
|
|
@@ -173,7 +180,7 @@ Add it as an object, or by name so JSON and YAML configs can use it too. A name
|
|
|
173
180
|
|
|
174
181
|
```jsonc
|
|
175
182
|
{
|
|
176
|
-
|
|
183
|
+
"integrations": ["quicklook-some-package", ["./my-integration.ts", { "key": "value" }]],
|
|
177
184
|
}
|
|
178
185
|
```
|
|
179
186
|
|