vite-node 0.0.2 → 0.1.0

package/README.md

@@ -6,9 +6,6 @@ Vite as Node runtime.
 
 > **EXPERIMENTAL**
 
-## Why?
-
-It runs Vite's id resolving, module transforming, and most importantly, the powerful plugins system!
 
 ## Usage
 
@@ -16,19 +13,31 @@ It runs Vite's id resolving, module transforming, and most importantly, the powe
 npx vite-node index.ts
 ```
 
+Options:
+
+```bash
+npx vite-node -h
+```
+
 ## Features
 
 - Out-of-box ESM & TypeScript support (possible for more with plugins)
 - Top-level await
-- Shims for `__dirname` and `__filename`
+- Vite plugins, resolve, aliasing
 - Respect `vite.config.ts`
-- Access to node modules like `fs`, `path` etc.
+- Shims for `__dirname` and `__filename` in ESM
+- Access to native node modules like `fs`, `path`, etc.
+- Watch mode (like `nodemon`)
 
 ## When NOT to Use
 
 - Production, yet - in very early stage, check it later
-- Most of the time when other tools can do that job
-  - We will need to start a Vite server upon each execution, which will have certain overhead. Only use it when you want the exactly same behavior as Vite or the powerful plugins system (for example, testing components that have Vite-specific setup).
+- Most of the time, when other tools can do that job
+  - We need to start a Vite server upon each execution, which inevitably introduces some overhead. Only use it when you want the same behavior as Vite or the powerful plugins system (for example, testing components with a Vite-specific setup).
+
+## Why?
+
+It runs Vite's id resolving, module transforming, and most importantly, the powerful plugins system!
 
 ## How?
 

package/index.mjs

@@ -1,19 +1,22 @@
+/* eslint-disable no-console */
 import { builtinModules, createRequire } from 'module'
 import { pathToFileURL } from 'url'
-import { join, dirname, resolve } from 'path'
+import { dirname, resolve, relative } from 'path'
 import { createServer } from 'vite'
 import createDebug from 'debug'
 import minimist from 'minimist'
-import { red, dim } from 'kolorist'
+import { red, dim, yellow, green, inverse, cyan } from 'kolorist'
 
 const argv = minimist(process.argv.slice(2), {
   alias: {
     r: 'root',
     c: 'config',
     h: 'help',
+    w: 'watch',
+    s: 'silent',
   },
   string: ['root', 'config'],
-  boolean: ['help', 'vue'],
+  boolean: ['help', 'vue', 'watch', 'silent'],
   unknown(name) {
     if (name[0] === '-') {
       console.error(red(`Unknown argument: ${name}`))
@@ -43,6 +46,8 @@ const root = argv.root || process.cwd()
 process.chdir(root)
 
 const server = await createServer({
+  logLevel: 'error',
+  clearScreen: false,
   configFile: argv.config,
   root,
   resolve: argv.vue
@@ -60,28 +65,95 @@ const server = await createServer({
     : {},
 })
 await server.pluginContainer.buildStart({})
-await execute(files, server, argv)
-await server.close()
-process.exit(process.exitCode || 0)
+let executing = false
+
+async function run() {
+  process.exitCode = 0
+  executing = true
+  let err
+  try {
+    await execute(files, server, argv)
+  }
+  catch (e) {
+    console.error(e)
+    err = e
+    if (!argv.watch)
+      process.exit(1)
+  }
+  finally {
+    executing = false
+  }
+
+  if (argv.watch) {
+    setTimeout(() => {
+      if (err || process.exitCode)
+        log(inverse(red(' vite node ')), red('program exited with error, waiting for file changes...'))
+      else
+        log(inverse(green(' vite node ')), green('program exited, waiting for file changes...'))
+    }, 10)
+  }
+  else {
+    await server.close()
+  }
+}
+
+if (argv.watch) {
+  log(inverse(cyan(' vite node ')), cyan('watch mode enabled\n'))
+
+  server.watcher.on('change', (file) => {
+    if (!executing) {
+      log(inverse(yellow(' vite node ')), yellow(`${file} changed, restarting...\n`))
+      run()
+    }
+  })
+}
+
+await run(files, server, argv)
 
 // --- CLI END ---
 
+function normalizeId(id) {
+  // Virtual modules start with `\0`
+  if (id && id.startsWith('/@id/__x00__'))
+    id = `\0${id.slice('/@id/__x00__'.length)}`
+  if (id && id.startsWith('/@id/'))
+    id = id.slice('/@id/'.length)
+  return id
+}
+
+function toFilePath(id) {
+  const absolute = id.startsWith('/@fs/')
+    ? id.slice(4)
+    : slash(resolve(server.config.root, id.slice(1)))
+
+  return absolute
+}
+
 async function execute(files, server) {
-  const cache = {}
+  const __pendingModules__ = new Map()
 
-  async function request(id) {
-    // Virtual modules start with `\0`
-    if (id && id.startsWith('/@id/__x00__'))
-      id = `\0${id.slice('/@id/__x00__'.length)}`
-    if (id && id.startsWith('/@id/'))
-      id = id.slice('/@id/'.length)
+  const result = []
+  for (const file of files)
+    result.push(await cachedRequest(`/@fs/${slash(resolve(file))}`, []))
+  return result
 
-    if (builtinModules.includes(id))
-      return import(id)
+  async function directRequest(rawId, callstack) {
+    if (builtinModules.includes(rawId))
+      return import(rawId)
+
+    callstack = [...callstack, rawId]
+    const request = async(dep) => {
+      if (callstack.includes(dep)) {
+        throw new Error(`${red('Circular dependency detected')}\nStack:\n${[...callstack, dep].reverse().map((i) => {
+          const path = relative(server.config.root, toFilePath(normalizeId(i)))
+          return dim(' -> ') + (i === dep ? yellow(path) : path)
+        }).join('\n')}\n`)
+      }
+      return cachedRequest(dep, callstack)
+    }
 
-    const absolute = id.startsWith('/@fs/')
-      ? id.slice(3)
-      : slash(join(server.config.root, id.slice(1)))
+    const id = normalizeId(rawId)
+    const absolute = toFilePath(id)
 
     debugRequest(absolute)
 
@@ -90,7 +162,7 @@ async function execute(files, server) {
       ? `/${absolute}`
       : absolute
 
-    if (id.includes('/node_modules/'))
+    if (absolute.includes('/node_modules/'))
       return import(unifiedPath)
 
     const result = await server.transformRequest(id, { ssr: true })
@@ -100,17 +172,16 @@ async function execute(files, server) {
     debugTransform(id, result.code)
 
     const url = pathToFileURL(unifiedPath)
-
     const exports = {}
 
     const context = {
       require: createRequire(url),
       __filename: absolute,
       __dirname: dirname(absolute),
-      __vite_ssr_import__: cachedRequest,
-      __vite_ssr_dynamic_import__: cachedRequest,
+      __vite_ssr_import__: request,
+      __vite_ssr_dynamic_import__: request,
       __vite_ssr_exports__: exports,
-      __vite_ssr_exportAll__: obj => Object.assign(exports, obj),
+      __vite_ssr_exportAll__: obj => exportAll(exports, obj),
       __vite_ssr_import_meta__: { url },
     }
 
@@ -120,22 +191,32 @@ async function execute(files, server) {
     )
 
     // prefetch deps
-    result.deps.forEach(dep => cachedRequest(dep))
-
     await fn(...Object.values(context))
+
     return exports
   }
 
-  function cachedRequest(path) {
-    if (!cache[path])
-      cache[path] = request(path)
-    return cache[path]
+  function cachedRequest(id, callstack) {
+    if (!__pendingModules__[id])
+      __pendingModules__[id] = directRequest(id, callstack)
+    return __pendingModules__[id]
   }
 
-  const result = []
-  for (const file of files)
-    result.push(await request(`/@fs/${slash(resolve(file))}`))
-  return result
+  function exportAll(exports, sourceModule) {
+    // eslint-disable-next-line no-restricted-syntax
+    for (const key in sourceModule) {
+      if (key !== 'default') {
+        try {
+          Object.defineProperty(exports, key, {
+            enumerable: true,
+            configurable: true,
+            get() { return sourceModule[key] },
+          })
+        }
+        catch (_err) { }
+      }
+    }
+  }
 }
 
 function slash(path) {
@@ -143,7 +224,6 @@ function slash(path) {
 }
 
 function help() {
-  // eslint-disable-next-line no-console
   console.log(`
 Usage:
   $ vite-node [options] [files]
@@ -151,6 +231,14 @@ Usage:
 Options:
   -r, --root <path>      ${dim('[string]')} use specified root directory
   -c, --config <file>    ${dim('[string]')} use specified config file
+  -w, --watch           ${dim('[boolean]')} restart on file changes, similar to "nodemon"
+  -s, --silent          ${dim('[boolean]')} do not emit errors and logs
   --vue                 ${dim('[boolean]')} support for importing Vue component
 `)
 }
+
+function log(...args) {
+  if (argv.silent)
+    return
+  console.log(...args)
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "vite-node",
-  "version": "0.0.2",
+  "version": "0.1.0",
   "description": "Vite as Node runtime",
   "keywords": [
     "vite"
@@ -33,23 +33,23 @@
     "bin"
   ],
   "dependencies": {
-    "debug": "^4.3.2",
+    "debug": "^4.3.3",
     "kolorist": "^1.5.0",
     "minimist": "^1.2.5",
     "vite": "^2.6.5"
   },
   "devDependencies": {
-    "@antfu/eslint-config": "^0.9.0",
-    "@antfu/ni": "^0.9.3",
+    "@antfu/eslint-config": "^0.11.1",
+    "@antfu/ni": "^0.11.0",
     "@types/debug": "^4.1.7",
-    "@types/node": "^16.10.3",
-    "@vitejs/plugin-vue": "^1.9.3",
+    "@types/node": "^16.11.11",
+    "@vitejs/plugin-vue": "^1.10.1",
     "bumpp": "^7.1.1",
-    "eslint": "^7.32.0",
-    "esno": "^0.10.1",
-    "typescript": "^4.4.3",
-    "uvu": "^0.5.1",
-    "vue": "^3.2.20"
+    "eslint": "^8.3.0",
+    "esno": "^0.12.1",
+    "typescript": "^4.5.2",
+    "uvu": "^0.5.2",
+    "vue": "^3.2.23"
   },
   "engines": {
     "node": ">=14.0.0"