{"id":15322,"library":"es-dev-server","title":"ES Dev Server","description":"ES Dev Server (version 2.1.0, though the project itself has seen its main development move to a new name) is a development server designed for modern web applications that leverage native ES modules directly in the browser, thereby eliminating the need for a separate bundling step during development. It offers features like efficient browser caching for fast reloads, on-demand code transformation for older browser compatibility, resolution of bare module imports (`--node-resolve`), and automatic browser reloading on file changes (`--watch`). Its key differentiator lies in promoting a \"no-build\" development workflow. While it remains functional and receives bug fixes, new development and active feature work have moved to its successor, `@web/dev-server`. Users are generally advised to use `@web/dev-server` for new projects and consider migrating existing ones.","status":"renamed","version":"2.1.0","language":"javascript","source_language":"en","source_url":"https://github.com/open-wc/es-dev-server","tags":["javascript","server","http-server","polyfill"],"install":[{"cmd":"npm install es-dev-server","lang":"bash","label":"npm"},{"cmd":"yarn add es-dev-server","lang":"bash","label":"yarn"},{"cmd":"pnpm add es-dev-server","lang":"bash","label":"pnpm"}],"dependencies":[],"imports":[{"note":"Primary interaction is via CLI. Using `npx` ensures the locally installed version is used.","wrong":"es-dev-server [options]","symbol":"es-dev-server CLI","correct":"npx es-dev-server [options]"},{"note":"For programmatic configuration in ESM environments. CommonJS `require` might lead to issues in mixed module environments.","wrong":"const { createConfig } = require('es-dev-server')","symbol":"createConfig","correct":"import { createConfig } from 'es-dev-server'"},{"note":"For starting the server programmatically in ESM environments.","wrong":"const { startServer } = require('es-dev-server')","symbol":"startServer","correct":"import { startServer } from 'es-dev-server'"}],"quickstart":{"code":"{\n  \"name\": \"my-es-dev-app\",\n  \"version\": \"1.0.0\",\n  \"description\": \"A simple app served by es-dev-server\",\n  \"scripts\": {\n    \"start\": \"es-dev-server --app-index public/index.html --node-resolve --watch --open --root-dir public\"\n  },\n  \"devDependencies\": {\n    \"es-dev-server\": \"^2.1.0\",\n    \"lit\": \"^2.0.0\" \n  }\n}\n\n<!-- public/index.html -->\n<!DOCTYPE html>\n<html lang=\"en\">\n<head>\n    <meta charset=\"UTF-8\">\n    <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n    <title>ES Dev Server App</title>\n</head>\n<body>\n    <h1>Welcome to ES Dev Server!</h1>\n    <script type=\"module\">\n        // This bare module import requires --node-resolve\n        import { html } from 'lit'; \n        console.log('App loaded via native ES Modules.');\n        document.body.innerHTML += html`<p>Lit-html import worked!</p>`;\n    </script>\n</body>\n</html>\n\n# To run:\n# npm install --save-dev es-dev-server lit\n# npm run start","lang":"javascript","description":"Demonstrates setting up `es-dev-server` to serve a simple HTML file with native ES module imports, using `npm scripts` for easy execution and `--node-resolve` for bare module support."},"warnings":[{"fix":"Migrate your project from `es-dev-server` to `@web/dev-server` following the official migration guides provided by the Open Web Components project. Ensure you update your `package.json` dependencies and server configuration.","message":"The `es-dev-server` project has been renamed to `@web/dev-server` (part of Open Web Components project). New development and active feature work is focused on the new package. Users are strongly recommended to migrate to `@web/dev-server` for new projects and consider upgrading existing ones.","severity":"breaking","affected_versions":"*"},{"fix":"Ensure your Node.js installation is version 10 or greater. Use a Node Version Manager (like `nvm`) to easily switch or update your Node.js environment.","message":"`es-dev-server` requires Node.js v10 or higher to function correctly. Older Node.js versions may lead to unexpected errors or a failure to start the server.","severity":"gotcha","affected_versions":"*"},{"fix":"Accept the self-signed certificate in your browser for local development. For more permanent solutions or different environments, you may need to configure `es-dev-server` to use trusted SSL certificates.","message":"When serving over HTTP2 (using the `--http2` flag), `es-dev-server` uses self-signed SSL certificates by default. This will cause browser security warnings (e.g., 'Your connection is not private').","severity":"gotcha","affected_versions":"*"},{"fix":"Carefully review the documentation for `node-resolve` and `compatibility` options. Enable `--node-resolve` if you are using bare module specifiers. Adjust `--compatibility` based on your target browser support matrix to avoid over-transpiling or missing necessary polyfills.","message":"Misconfiguration of `--node-resolve` and `--compatibility` flags can lead to issues. For instance, `--node-resolve` is crucial for handling bare module imports (e.g., `import 'lit'`), while `--compatibility` transforms code for older browsers, which might conflict or be unnecessary if not carefully managed.","severity":"gotcha","affected_versions":"*"}],"env_vars":null,"last_verified":"2026-04-21T00:00:00.000Z","next_check":"2026-07-20T00:00:00.000Z","problems":[{"fix":"Run `npm install --save-dev es-dev-server` to install the package. If running via CLI, ensure you use `npx es-dev-server` or define it as a script in `package.json` (e.g., `\"start\": \"es-dev-server ...\"`).","cause":"The `es-dev-server` package is not installed or the `es-dev-server` command is not accessible in your system's PATH.","error":"Error: Cannot find module 'es-dev-server'"},{"fix":"Change the port `es-dev-server` listens on using the `--port` flag (e.g., `es-dev-server --port 8001`) or by modifying your configuration file. Alternatively, identify and terminate the process currently occupying the port.","cause":"Another process on your machine is currently using the specified or default HTTP port (e.g., 8000).","error":"Address already in use :::XXXX (where XXXX is a port number)"},{"fix":"Rewrite the problematic file to use ES module `import` syntax instead of `require()`. Ensure your `package.json` `type` field is correctly set, or use appropriate file extensions (e.g., `.cjs` for CommonJS, `.mjs` for ESM).","cause":"You are attempting to use CommonJS `require()` syntax within a JavaScript file that is being interpreted as an ES module (e.g., a programmatic config file or a custom plugin script).","error":"ReferenceError: require is not defined in ES module scope"}],"ecosystem":"npm"}