This is a static web server for developing JavaScript/TypeScript using ES modules following the concept of [Unbundled Development](https://www.snowpack.dev/concepts/how-snowpack-works).
This is a static web server for developing JavaScript/TypeScript using ES modules following the concept of Unbundled Development.
You export Component as the default module export.
import { app, Component } from 'apprun';
export default class AboutComponent extends Component {
state = 'About';
view = state => <div>
<h1>{state}</h1>
</div>;
update = {
'#About': state => state,
};
}
Then, you use the Component in the main file.
import About from './About';
new About().start('my-app');
Then, you use module-type script tag in HTML.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>AppRun SPA</title>
</head>
<body>
<script type="module" src="/dist/main.js"></script>
</body>
</html>
Turn on the compiler, TypeScript or Babel in watch mode. And then, start the esm-server using npx.
npx esm-server
esm-server checks and modifies *.js file if they have global modules. In the console, if you see the file names that have some dots '......' in front, they are the files modified.
You can download an example app to give it a try.
npx degit yysun/apprun-esm-server my-app
Create a esm-server.config.js in your project:
module.exports = {
port: 8181, // Set the server port. Defaults to 8080.
host: "0.0.0.0", // Set the address to bind to. Defaults to 0.0.0.0 or process.env.IP.
root: "public", // Set root directory that's being served. Defaults to cwd.
open: false, // When false, it won't load your browser by default.
ignore: '', // comma-separated string for paths to ignore
file: "index.html", // When set, serve this file (server root relative) for every 404 (useful for single-page applications)
wait: 1000, // Waits for all changes, before reloading. Defaults to 0 sec.
mount: [], // Mount a directory to a route.
logLevel: 2, //
}
Don't want esm-server to invoke compilers/loaders. It is perfectly fine to use the TypeScript compiler in watch mode. esm-server is a webserver to serve modules. Nothing else.
Webpack is still needed and recommended for building production code for now.
The node-modules folder size is a problem. esm-server can run from npx. It does not need to live in the node-modules. However, it does not get away from npm install and huge node-modules folder, because we still need referenced packages, ESLint, Jest... Good luck with future npm improvement.
Based on the opinions above, I will keep esm-server simple. KISS!
Give it a try and send pull requests.
(C) Copyright 2020, Yiyi Sun
FAQs
This is a static web server for developing JavaScript/TypeScript using ES modules following the concept of [Unbundled Development](https://www.snowpack.dev/concepts/how-snowpack-works).
The npm package esm-server receives a total of 2 weekly downloads. As such, esm-server popularity was classified as not popular.
We found that esm-server demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
OpenAI rotated macOS signing certificates after a malicious Axios package reached its CI pipeline in a broader software supply chain attack.
Security News
Open source is under attack because of how much value it creates. It has been the foundation of every major software innovation for the last three decades. This is not the time to walk away from it.
Security News
Socket CEO Feross Aboukhadijeh breaks down how North Korea hijacked Axios and what it means for the future of software supply chain security.