Skip to content

Instantly share code, notes, and snippets.

@bencord0
Last active September 4, 2020 22:10
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save bencord0/bb1b551d55027ad39b9f6038beb5d062 to your computer and use it in GitHub Desktop.
Save bencord0/bb1b551d55027ad39b9f6038beb5d062 to your computer and use it in GitHub Desktop.
Hello World Without Webpack
import React from "https://dev.jspm.io/react";
declare global {
namespace JSX {
interface IntrinsicElements {
[key: string]: any;
}
}
}
function App() {
return (
<p>Hello World</p>
);
}
export default App;
const [_, bundle] = await Deno.bundle("./index.tsx");
console.log(bundle);
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Hello World!</title>
</head>
<body>
<div id="root" />
<script src="/index.js" defer></script>
</body>
</html>
import React from "https://dev.jspm.io/react";
import ReactDom from "https://dev.jspm.io/react-dom";
import App from "./app.tsx";
(ReactDom as any).render(
<App />,
document.getElementById("root"),
);
build: dist/index.html dist/index.js
.PHONY: build
dist/index.html: index.html
mkdir -p dist
cp -v $^ $@
dist/index.js: *.tsx
mkdir -p dist
deno run --allow-net --allow-read --unstable bundle.tsx -c tsconfig.json > $@
{
"compilerOptions": {
"target": "es6",
"module": "commonjs"
"lib": [
"DOM",
"ES2017",
"deno.ns"
],
"strict": true,
"esModuleInterop": true,
"skipLibCheck": true,
"forceConsistentCasingInFileNames": true
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment