@md-plugins/vite-examples-plugin 0.1.0-alpha.1 → 0.1.0-alpha.5

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/LICENSE.md CHANGED
@@ -1,6 +1,6 @@
1
1
  The MIT License (MIT)
2
2
 
3
- Copyright (c) 2024-present, Jeff Galbraith
3
+ Copyright (c) 2024-present, MD-PLUGINS
4
4
 
5
5
  Permission is hereby granted, free of charge, to any person obtaining a copy
6
6
  of this software and associated documentation files (the "Software"), to deal
package/README.md CHANGED
@@ -30,22 +30,26 @@ pnpm add @md-plugins/vite-examples-plugin
30
30
 
31
31
  To use the `viteExamplesPlugin`, configure it in your Vite project:
32
32
 
33
- ```js
34
- import { defineConfig } from 'vite';
35
- import vue from '@vitejs/plugin-vue';
36
- import { viteExamplesPlugin } from '@md-plugin/vite-examples-plugin';
33
+ ```typescript
34
+ import { defineConfig } from 'vite'
35
+ import vue from '@vitejs/plugin-vue'
36
+ import { viteExamplesPlugin, viteManualChunks } from 'vite-examples-plugin'
37
37
 
38
- export default defineConfig({
39
- plugins: [vue(), viteExamplesPlugin('/absolute/path/to/examples')],
40
- });
38
+ export default defineConfig(({ mode }) => {
39
+ const isProduction = mode === 'production'
40
+
41
+ return {
42
+ plugins: [vue(), viteExamplesPlugin(isProduction, '/absolute/path/to/examples')],
43
+ }
44
+ })
41
45
  ```
42
46
 
43
47
  ### Manual Chunk Splitting with Vite
44
48
 
45
49
  ```js
46
- import { defineConfig } from 'vite';
47
- import vue from '@vitejs/plugin-vue';
48
- import { viteExamplesPlugin, viteManualChunks } from 'vite-examples-plugin';
50
+ import { defineConfig } from 'vite'
51
+ import vue from '@vitejs/plugin-vue'
52
+ import { viteExamplesPlugin, viteManualChunks } from 'vite-examples-plugin'
49
53
 
50
54
  export default defineConfig({
51
55
  plugins: [vue(), viteExamplesPlugin('/absolute/path/to/examples')],
@@ -57,7 +61,7 @@ export default defineConfig({
57
61
  },
58
62
  },
59
63
  },
60
- });
64
+ })
61
65
  ```
62
66
 
63
67
  ## Quasar Framework Configuration
@@ -74,7 +78,7 @@ export default defineConfig((ctx) => {
74
78
  ```js
75
79
  build: {
76
80
  vitePlugins: [
77
- viteExamplesPlugin(ctx.appPaths.srcDir + '/examples'),
81
+ viteExamplesPlugin(ctx.isProd, ctx.appPaths.srcDir + '/examples'),
78
82
  // ...
79
83
  ],
80
84
  },
@@ -84,19 +88,14 @@ export default defineConfig((ctx) => {
84
88
  ### Manual Chunk Splitting with Quasar
85
89
 
86
90
  ```js
87
- import {
88
- viteExamplesPlugin,
89
- viteManualChunks,
90
- } from '@md-plugins/vite-examples-plugin';
91
+ import { viteExamplesPlugin, viteManualChunks } from '@md-plugins/vite-examples-plugin'
91
92
  ```
92
93
 
93
94
  ```js
94
95
  build: {
95
96
  extendViteConf(viteConf, { isClient }) {
96
97
  if (ctx.prod && isClient) {
97
- if (!viteConf.build) {
98
- viteConf.build = {}
99
- }
98
+ viteConf.build = viteConf.build || {}
100
99
  viteConf.build.chunkSizeWarningLimit = 650
101
100
  viteConf.build.rollupOptions = {
102
101
  output: { manualChunks: viteManualChunks },
@@ -156,12 +155,12 @@ During development, the plugin uses Vite's `import.meta.glob` to dynamically loa
156
155
  ```ts
157
156
  export const code = import.meta.glob('/src/examples/example1/*.vue', {
158
157
  eager: true,
159
- });
158
+ })
160
159
  export const source = import.meta.glob('/src/examples/example1/*.vue', {
161
160
  query: '?raw',
162
161
  import: 'default',
163
162
  eager: true,
164
- });
163
+ })
165
164
  ```
166
165
 
167
166
  ### Production Mode
@@ -169,10 +168,10 @@ export const source = import.meta.glob('/src/examples/example1/*.vue', {
169
168
  In production, the plugin preloads example components and their raw source code, generating import and export statements:
170
169
 
171
170
  ```ts
172
- import Example1 from 'app/src/examples/example1/Example1.vue';
173
- import RawExample1 from 'app/src/examples/example1/Example1.vue?raw';
171
+ import Example1 from 'app/src/examples/example1/Example1.vue'
172
+ import RawExample1 from 'app/src/examples/example1/Example1.vue?raw'
174
173
 
175
- export { Example1, RawExample1 };
174
+ export { Example1, RawExample1 }
176
175
  ```
177
176
 
178
177
  ## Development Notes
@@ -196,7 +195,7 @@ The plugin is structured with the following components:
196
195
  If the `targetFolder` is not defined when the plugin is initialized, an error will be thrown:
197
196
 
198
197
  ```ts
199
- throw new Error('targetFolder is not defined');
198
+ throw new Error('targetFolder is not defined')
200
199
  ```
201
200
 
202
201
  ## License
package/dist/index.d.mts CHANGED
@@ -1,3 +1,5 @@
1
+ import { Plugin } from '/home/jeff/git/github/jeff/md-plugins/node_modules/.pnpm/vite@6.0.7_@types+node@22.10.5_jiti@2.4.2_sass-embedded@1.83.0_terser@5.37.0/node_modules/vite/dist/node/index.d.ts';
2
+
1
3
  /**
2
4
  * Creates a Vite plugin for handling Markdown examples.
3
5
  *
@@ -5,19 +7,20 @@
5
7
  * that creates the actual Vite plugin. The returned plugin resolves and loads
6
8
  * example code based on the production or development environment.
7
9
  *
10
+ * @param isProd - A boolean indicating whether the Vite build is in production mode.
11
+ * This parameter determines whether the plugin will use the `prodLoad` or `devLoad` function for loading example code.
12
+ *
8
13
  * @param path - The path to the directory containing the example files.
9
14
  * This path will be used as the target folder for resolving examples.
15
+ * The `targetFolder` variable is set to this value before creating the Vite plugin.
10
16
  *
11
- * @returns A function that creates a Vite plugin. This function takes a boolean
12
- * parameter indicating whether the build is in production mode and
13
- * returns the configured Vite plugin object.
17
+ * @returns A function that creates a Vite plugin.
18
+ * The returned function takes a boolean parameter `isProd` and returns a Vite plugin object.
19
+ * The plugin object has a `name`, `enforce`, `resolveId`, and `load` property.
20
+ * The `resolveId` property resolves module IDs starting with "examples:" and returns a resolved ID.
21
+ * The `load` property loads example code based on the production or development environment.
14
22
  */
15
- declare function viteExamplesPlugin(path: string): (isProd: boolean) => {
16
- name: string;
17
- enforce: 'pre';
18
- resolveId(id: string): string | undefined;
19
- load(id: string): string | undefined;
20
- };
23
+ declare function viteExamplesPlugin(isProd: boolean, path: string): Plugin;
21
24
 
22
25
  /**
23
26
  * A function to determine the manual chunk name for a given module ID.
package/dist/index.d.ts CHANGED
@@ -1,3 +1,5 @@
1
+ import { Plugin } from '/home/jeff/git/github/jeff/md-plugins/node_modules/.pnpm/vite@6.0.7_@types+node@22.10.5_jiti@2.4.2_sass-embedded@1.83.0_terser@5.37.0/node_modules/vite/dist/node/index.d.ts';
2
+
1
3
  /**
2
4
  * Creates a Vite plugin for handling Markdown examples.
3
5
  *
@@ -5,19 +7,20 @@
5
7
  * that creates the actual Vite plugin. The returned plugin resolves and loads
6
8
  * example code based on the production or development environment.
7
9
  *
10
+ * @param isProd - A boolean indicating whether the Vite build is in production mode.
11
+ * This parameter determines whether the plugin will use the `prodLoad` or `devLoad` function for loading example code.
12
+ *
8
13
  * @param path - The path to the directory containing the example files.
9
14
  * This path will be used as the target folder for resolving examples.
15
+ * The `targetFolder` variable is set to this value before creating the Vite plugin.
10
16
  *
11
- * @returns A function that creates a Vite plugin. This function takes a boolean
12
- * parameter indicating whether the build is in production mode and
13
- * returns the configured Vite plugin object.
17
+ * @returns A function that creates a Vite plugin.
18
+ * The returned function takes a boolean parameter `isProd` and returns a Vite plugin object.
19
+ * The plugin object has a `name`, `enforce`, `resolveId`, and `load` property.
20
+ * The `resolveId` property resolves module IDs starting with "examples:" and returns a resolved ID.
21
+ * The `load` property loads example code based on the production or development environment.
14
22
  */
15
- declare function viteExamplesPlugin(path: string): (isProd: boolean) => {
16
- name: string;
17
- enforce: 'pre';
18
- resolveId(id: string): string | undefined;
19
- load(id: string): string | undefined;
20
- };
23
+ declare function viteExamplesPlugin(isProd: boolean, path: string): Plugin;
21
24
 
22
25
  /**
23
26
  * A function to determine the manual chunk name for a given module ID.
package/dist/index.mjs CHANGED
@@ -16,9 +16,7 @@ function prodLoad(id) {
16
16
  if (id.startsWith(resolvedIdPrefix)) {
17
17
  const exampleId = id.substring(id.indexOf(":") + 1);
18
18
  const files = globSync("*.vue", { cwd: join(targetFolder, exampleId) });
19
- const importList = files.map(
20
- (entry) => entry.substring(0, entry.length - 4)
21
- );
19
+ const importList = files.map((entry) => entry.substring(0, entry.length - 4));
22
20
  const importStatements = importList.map(
23
21
  (entry) => `import ${entry} from 'app/src/examples/${exampleId}/${entry}.vue'
24
22
  import Raw${entry} from 'app/src/examples/${exampleId}/${entry}.vue?raw'`
@@ -46,9 +44,9 @@ function vitePlugin(isProd) {
46
44
  load: isProd ? prodLoad : devLoad
47
45
  };
48
46
  }
49
- function viteExamplesPlugin(path) {
47
+ function viteExamplesPlugin(isProd, path) {
50
48
  targetFolder = path;
51
- return vitePlugin;
49
+ return vitePlugin(isProd);
52
50
  }
53
51
 
54
52
  const vendorRE = /node_modules[\\/](vue|@vue|quasar|vue-router)[\\/](.*)\.(m?js|css|sass)$/;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@md-plugins/vite-examples-plugin",
3
- "version": "0.1.0-alpha.1",
3
+ "version": "0.1.0-alpha.5",
4
4
  "description": "A Vite plugin for @md-plugins for handling imported examples in markdown files.",
5
5
  "keywords": [
6
6
  "markdown-it",
@@ -37,11 +37,12 @@
37
37
  "publishConfig": {
38
38
  "access": "public"
39
39
  },
40
- "dependencies": {
41
- "tinyglobby": "^0.2.10"
40
+ "devDependencies": {
41
+ "tinyglobby": "^0.2.10",
42
+ "vite": "^6.0.7"
42
43
  },
43
44
  "scripts": {
44
45
  "build": "unbuild",
45
- "clean": "rm -rf dist"
46
+ "clean": "rm -rf dist/ node_modules/"
46
47
  }
47
48
  }