feat!: migrate cli to full ESM

Author: antfu

.vscode/settings.json

@@ -16,7 +16,7 @@
 
   // Auto fix
   "editor.codeActionsOnSave": {
-    "source.fixAll.eslint": true,
+    "source.fixAll.eslint": "explicit",
     "source.organizeImports": false
   },
 

packages/client/package.json

@@ -11,6 +11,10 @@
     "url": "https://github.com/slidevjs/slidev"
   },
   "bugs": "https://github.com/slidevjs/slidev/issues",
+  "exports": {
+    "./package.json": "./package.json",
+    "./*": "./*"
+  },
   "engines": {
     "node": ">=18.0.0"
   },

packages/slidev/bin/slidev.js

@@ -0,0 +1,3 @@
+#!/usr/bin/env node
+'use strict'
+import ('../dist/cli.mjs')

packages/slidev/bin/slidev.mjs

@@ -46,7 +46,7 @@ injectPreparserExtensionLoader(async (headmatter?: Record<string, unknown>, file
   return await loadSetups(roots, 'preparser.ts', { filepath, headmatter }, [], mergeArrays)
 })
 
-const cli = yargs
+const cli = yargs(process.argv.slice(2))
   .scriptName('slidev')
   .usage('$0 [args]')
   .version(version)

packages/slidev/node/cli.ts

@@ -1,5 +1,6 @@
 import { dirname, join, resolve } from 'node:path'
 import process from 'node:process'
+import { fileURLToPath } from 'node:url'
 import type Vue from '@vitejs/plugin-vue'
 import type VueJsx from '@vitejs/plugin-vue-jsx'
 import type Icons from 'unplugin-icons/vite'
@@ -19,6 +20,7 @@ import { getThemeMeta, promptForThemeInstallation, resolveThemeName } from './th
 import { getAddons } from './addons'
 
 const debug = _debug('slidev:options')
+const __dirname = dirname(fileURLToPath(import.meta.url))
 
 export interface SlidevEntryOptions {
   /**

packages/slidev/node/options.ts

@@ -3,7 +3,7 @@ import process from 'node:process'
 import type { Connect, ModuleNode, Plugin, Update, ViteDevServer } from 'vite'
 import { isString, notNullish, objectMap, range, slash, uniq } from '@antfu/utils'
 import fg from 'fast-glob'
-import fs, { existsSync } from 'fs-extra'
+import fs from 'fs-extra'
 import Markdown from 'markdown-it'
 import { bold, gray, red, yellow } from 'kolorist'
 
@@ -552,7 +552,7 @@ defineProps<{ no: number | string }>()`)
       ]
 
       for (const style of styles) {
-        if (existsSync(style)) {
+        if (fs.existsSync(style)) {
           imports.push(`import "${toAtFS(style)}"`)
           continue
         }

packages/slidev/node/plugins/loaders.ts

@@ -1,13 +1,16 @@
 // forked from https://github.com/jGleitz/markdown-it-prism
 // it's modified to output line wrapper `<div class="line" />` for each line
 
+import { createRequire } from 'node:module'
 import type { Grammar } from 'prismjs'
 import Prism from 'prismjs'
-import loadLanguages from 'prismjs/components/'
+import loadLanguages from 'prismjs/components/index.js'
 import type MarkdownIt from 'markdown-it'
 import * as htmlparser2 from 'htmlparser2'
 import { escapeVueInCode } from './markdown'
 
+const require = createRequire(import.meta.url)
+
 interface Options {
   plugins: string[]
   /**
@@ -90,7 +93,6 @@ function loadPrismLang(lang: string): Grammar | undefined {
  */
 function loadPrismPlugin(name: string): void {
   try {
-    // eslint-disable-next-line ts/no-require-imports
     require(`prismjs/plugins/${name}/prism-${name}`)
   }
   catch (e) {

packages/slidev/node/plugins/markdown-it-prism.ts

@@ -1,5 +1,6 @@
 import { resolve } from 'node:path'
-import { pathExists } from 'fs-extra'
+import { fileURLToPath } from 'node:url'
+import fs from 'fs-extra'
 import { isObject } from '@antfu/utils'
 import jiti from 'jiti'
 
@@ -26,8 +27,8 @@ export async function loadSetups<T, R extends object>(
   let returns = initial
   for (const root of roots) {
     const path = resolve(root, 'setup', name)
-    if (await pathExists(path)) {
-      const { default: setup } = jiti(__filename)(path)
+    if (await fs.pathExists(path)) {
+      const { default: setup } = jiti(fileURLToPath(import.meta.url))(path)
       const result = await setup(arg)
       if (result !== null) {
         returns = typeof merge === 'function'

packages/slidev/node/plugins/setupNode.ts

@@ -1,5 +1,6 @@
 import { resolve } from 'node:path'
 import { existsSync } from 'node:fs'
+import { fileURLToPath } from 'node:url'
 import { uniq } from '@antfu/utils'
 import type { Theme } from '@unocss/preset-uno'
 import type { UserConfig } from '@unocss/core'
@@ -26,7 +27,7 @@ export async function createUnocssPlugin(
 
   const configs = configFiles
     .map((i) => {
-      const loaded = jiti(__filename)(i)
+      const loaded = jiti(fileURLToPath(import.meta.url))(i)
       const config = 'default' in loaded ? loaded.default : loaded
       return config
     })

packages/slidev/node/plugins/unocss.ts

@@ -1,5 +1,6 @@
 import { dirname, resolve } from 'node:path'
 import { existsSync } from 'node:fs'
+import { fileURLToPath } from 'node:url'
 import { slash, uniq } from '@antfu/utils'
 import type { WindiCssOptions } from 'vite-plugin-windicss'
 import jiti from 'jiti'
@@ -22,7 +23,7 @@ export async function createWindiCSSPlugin(
   ])
 
   const configFile = configFiles.find(i => existsSync(i))!
-  let config = jiti(__filename)(configFile) as WindiCssOptions
+  let config = jiti(fileURLToPath(import.meta.url))(configFile) as WindiCssOptions
   if (config.default)
     config = config.default
 

packages/slidev/node/plugins/windicss.ts

@@ -1,11 +1,16 @@
-import { join } from 'node:path'
+import { dirname, join } from 'node:path'
+import { createRequire } from 'node:module'
+import { fileURLToPath } from 'node:url'
 import { ensurePrefix, slash } from '@antfu/utils'
 import isInstalledGlobally from 'is-installed-globally'
-import { sync as resolve } from 'resolve'
+import resolve from 'resolve'
 import globalDirs from 'global-dirs'
 import type Token from 'markdown-it/lib/token'
 import type { ResolvedFontOptions } from '@slidev/types'
 
+const require = createRequire(import.meta.url)
+const __dirname = dirname(fileURLToPath(import.meta.url))
+
 export function toAtFS(path: string) {
   return `/@fs${ensurePrefix('/', slash(path))}`
 }
@@ -14,8 +19,9 @@ export function resolveImportPath(importName: string, ensure: true): string
 export function resolveImportPath(importName: string, ensure?: boolean): string | undefined
 export function resolveImportPath(importName: string, ensure = false) {
   try {
-    return resolve(importName, {
+    return resolve.sync(importName, {
       preserveSymlinks: false,
+      basedir: __dirname,
     })
   }
   catch {}
@@ -40,7 +46,10 @@ export function resolveImportPath(importName: string, ensure = false) {
 
 export function resolveGlobalImportPath(importName: string): string {
   try {
-    return resolve(importName, { preserveSymlinks: false, basedir: __dirname })
+    return resolve.sync(importName, {
+      preserveSymlinks: false,
+      basedir: __dirname,
+    })
   }
   catch {}
 

packages/slidev/node/utils.ts

@@ -22,7 +22,7 @@
   "module": "dist/index.mjs",
   "types": "dist/index.d.ts",
   "bin": {
-    "slidev": "./bin/slidev.js"
+    "slidev": "./bin/slidev.mjs"
   },
   "files": [
     "bin",

packages/slidev/package.json

@@ -3,7 +3,6 @@ import { defineConfig } from 'tsup'
 export default defineConfig({
   format: [
     'esm',
-    'cjs',
   ],
   target: 'node18',
   splitting: true,