@tomjs/vite-plugin-vscode 4.0.0 → 4.2.0

package/README.md

@@ -13,11 +13,16 @@ In development mode, inject the same code of [@tomjs/vscode-extension-webview](h
 - Use [tsup](https://github.com/egoist/tsup) to quickly build `extension code`
 - Simple configuration, focus on business
 - Support `esm` and `cjs`
+- Support ESM extension (vscode `v1.100.0+`)
 - Support webview `HMR`
 - Support `acquireVsCodeApi` of [@types/vscode-webview](https://www.npmjs.com/package/@types/vscode-webview)
 - Support [Multi-Page App](https://vitejs.dev/guide/build.html#multi-page-app)
 - Supports `vue` and `react` and other [frameworks](https://cn.vitejs.dev/guide/#trying-vite-online) supported by `vite`
 
+### ESM extension
+
+The NodeJS extension host now (`v1.100.0+`) supports extensions that use JavaScript-modules (ESM). All it needs is the `"type": "module"` entry in your extension's `package.json` file. With that, the JavaScript code can use `import` and `export` statements, including the special module `import('vscode')`.
+
 ## Install
 
 ```bash
@@ -427,6 +432,7 @@ Open the [examples](./examples) directory, there are `vue` and `react` examples.
 
 - [react](./examples/react): Simple react example.
 - [vue](./examples/vue): Simple vue example.
+- [vue-esm](./examples/vue-esm): Simple vue (ESM Extension) example.
 - [vue-import](./examples/vue-import): Dynamic import() and multi-page examples.
 
 ## Related

package/README.zh_CN.md

@@ -13,11 +13,16 @@
 - 使用 [tsup](https://github.com/egoist/tsup) 快速构建 `扩展代码`
 - 配置简单，专注业务
 - 支持 `esm`和 `cjs`
+- 支持 ESM 扩展（vscode `v1.100.0+`）
 - 支持 webview `HMR`
 - 支持 [@types/vscode-webview](https://www.npmjs.com/package/@types/vscode-webview) 的 `acquireVsCodeApi`
 - 支持[多页面应用](https://cn.vitejs.dev/guide/build.html#multi-page-app)
 - 支持 `vue` 、`react` 等其他 `vite` 支持的[框架](https://cn.vitejs.dev/guide/#trying-vite-online)
 
+### ESM 扩展
+
+NodeJS 扩展现在(`v1.100.0+`)支持使用 JavaScript 模块 (ESM) 的扩展。它只需要在扩展的 `package.json` 文件中添加 `"type": "module"` 条目即可。这样，JavaScript 代码就可以使用 `import` 和 `export` 语句，包括特殊的模块 `import('vscode')`
+
 ## 安装
 
 ```bash
@@ -431,6 +436,7 @@ pnpm build
 
 - [react](./examples/react)：简单的 react 示例。
 - [vue](./examples/vue)：简单的 vue 示例。
+- [vue-esm](./examples/vue-esm)：简单的 vue（ESM 扩展）示例。
 - [vue-import](./examples/vue-import)：动态 import() 和多页面示例。
 
 ## 关联

package/dist/index.d.mts

@@ -90,4 +90,4 @@ interface PluginOptions {
 
 declare function useVSCodePlugin(options?: PluginOptions): PluginOption;
 
-export { ExtensionOptions, PluginOptions, WebviewOption, useVSCodePlugin as default, useVSCodePlugin };
+export { type ExtensionOptions, type PluginOptions, type WebviewOption, useVSCodePlugin as default, useVSCodePlugin };

package/dist/index.d.ts

@@ -90,4 +90,4 @@ interface PluginOptions {
 
 declare function useVSCodePlugin(options?: PluginOptions): PluginOption;
 
-export { ExtensionOptions, PluginOptions, WebviewOption, useVSCodePlugin as default, useVSCodePlugin };
+export { type ExtensionOptions, type PluginOptions, type WebviewOption, useVSCodePlugin as default, useVSCodePlugin };

package/dist/index.js

@@ -97,6 +97,7 @@ function getPkg() {
 }
 function preMergeOptions(options) {
   const pkg = getPkg();
+  const format = pkg.type === "module" ? "esm" : "cjs";
   const opts = _lodashmerge2.default.call(void 0, 
     {
       webview: true,
@@ -105,8 +106,8 @@ function preMergeOptions(options) {
       extension: {
         entry: "extension/index.ts",
         outDir: "dist-extension",
-        target: ["es2019", "node14"],
-        format: "cjs",
+        target: format === "esm" ? ["node20"] : ["es2019", "node14"],
+        format,
         shims: true,
         clean: true,
         dts: false,
@@ -417,8 +418,8 @@ function useVSCodePlugin(options) {
     }
   ];
 }
-var src_default = useVSCodePlugin;
+var index_default = useVSCodePlugin;
 
 
 
-exports.default = src_default; exports.useVSCodePlugin = useVSCodePlugin;
+exports.default = index_default; exports.useVSCodePlugin = useVSCodePlugin;

package/dist/index.mjs

@@ -1,4 +1,4 @@
-// node_modules/.pnpm/tsup@7.2.0_@swc+core@1.7.26_postcss@8.4.49_typescript@5.3.3/node_modules/tsup/assets/esm_shims.js
+// node_modules/.pnpm/tsup@8.4.0_@swc+core@1.11.24_jiti@1.21.0_postcss@8.4.49_tsx@4.19.2_typescript@5.3.3_yaml@2.5.1/node_modules/tsup/assets/esm_shims.js
 import { fileURLToPath } from "url";
 import path from "path";
 var getFilename = () => fileURLToPath(import.meta.url);
@@ -6,10 +6,10 @@ var getDirname = () => path.dirname(getFilename());
 var __dirname = /* @__PURE__ */ getDirname();
 
 // src/index.ts
-import fs from "fs";
-import os from "os";
-import path2 from "path";
-import { cwd } from "process";
+import fs from "node:fs";
+import os from "node:os";
+import path2 from "node:path";
+import { cwd } from "node:process";
 import { emptyDirSync, readFileSync, readJsonSync } from "@tomjs/node";
 import merge from "lodash.merge";
 import { parse as htmlParser } from "node-html-parser";
@@ -104,6 +104,7 @@ function getPkg() {
 }
 function preMergeOptions(options) {
   const pkg = getPkg();
+  const format = pkg.type === "module" ? "esm" : "cjs";
   const opts = merge(
     {
       webview: true,
@@ -112,8 +113,8 @@ function preMergeOptions(options) {
       extension: {
         entry: "extension/index.ts",
         outDir: "dist-extension",
-        target: ["es2019", "node14"],
-        format: "cjs",
+        target: format === "esm" ? ["node20"] : ["es2019", "node14"],
+        format,
         shims: true,
         clean: true,
         dts: false,
@@ -424,8 +425,8 @@ function useVSCodePlugin(options) {
     }
   ];
 }
-var src_default = useVSCodePlugin;
+var index_default = useVSCodePlugin;
 export {
-  src_default as default,
+  index_default as default,
   useVSCodePlugin
 };

package/dist/webview.d.mts

@@ -10,4 +10,4 @@ interface WebviewHtmlOptions {
  */
 declare function getWebviewHtml(options: WebviewHtmlOptions): string;
 
-export { WebviewHtmlOptions, getWebviewHtml as default, getWebviewHtml };
+export { type WebviewHtmlOptions, getWebviewHtml as default, getWebviewHtml };

package/dist/webview.d.ts

@@ -10,4 +10,4 @@ interface WebviewHtmlOptions {
  */
 declare function getWebviewHtml(options: WebviewHtmlOptions): string;
 
-export { WebviewHtmlOptions, getWebviewHtml as default, getWebviewHtml };
+export { type WebviewHtmlOptions, getWebviewHtml as default, getWebviewHtml };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tomjs/vite-plugin-vscode",
-  "version": "4.0.0",
+  "version": "4.2.0",
   "description": "Use vue/react to develop 'vscode extension webview', supporting esm/cjs",
   "keywords": [
     "vite",
@@ -38,7 +38,7 @@
     "env.d.ts"
   ],
   "engines": {
-    "node": ">=16"
+    "node": ">=18"
   },
   "publishConfig": {
     "access": "public",
@@ -56,7 +56,7 @@
     "lodash.clonedeep": "^4.5.0",
     "lodash.merge": "^4.6.2",
     "node-html-parser": "^6.1.13",
-    "tsup": "7.2.0"
+    "tsup": "^8.4.0"
   },
   "devDependencies": {
     "@commitlint/cli": "^19.6.0",
@@ -68,7 +68,7 @@
     "@types/lodash.clonedeep": "^4.5.9",
     "@types/lodash.merge": "^4.6.9",
     "@types/node": "18.19.67",
-    "@vitejs/plugin-vue": "^5.1.4",
+    "@vitejs/plugin-vue": "^5.2.4",
     "cross-env": "^7.0.3",
     "eslint": "^9.16.0",
     "globals": "^15.13.0",
@@ -80,7 +80,7 @@
     "stylelint": "^16.11.0",
     "tsx": "^4.19.2",
     "typescript": "~5.3.3",
-    "vite": "^5.4.11",
+    "vite": "^6.3.5",
     "vue-tsc": "^2.1.10"
   },
   "peerDependencies": {