Created
June 29, 2020 02:13
-
-
Save keelii/7ad4bc96b4cc8d026b1f976078bfa4a8 to your computer and use it in GitHub Desktop.
TypeScript React development with ESBuild
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
{ | |
"name": "demo", | |
"version": "0.0.1", | |
"private": true, | |
"dependencies": { | |
"react": "^16.13.1", | |
"react-dom": "^16.13.1" | |
}, | |
"scripts": { | |
"dev": "NODE_ENV=development node bin/run.js" | |
}, | |
"devDependencies": { | |
"@types/node": "^12.12.37", | |
"@types/react": "^16.9.34", | |
"@types/react-dom": "^16.9.7", | |
"chokidar": "^3.4.0", | |
"esbuild": "^0.4.0", | |
"http-server": "^0.12.3" | |
} | |
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
const { build } = require('esbuild') | |
const chokidar = require('chokidar') | |
const { createServer } = require('http-server') | |
const env = process.env.NODE_ENV | |
function runServer() { | |
const server = createServer({ | |
root: "./public", | |
showDir: true, | |
autoIndex: false, | |
gzip: true, | |
brotli: true, | |
}) | |
const PORT = 9999 | |
server.listen(PORT) | |
console.log("Server is listen on port: " + PORT) | |
} | |
function runBuild() { | |
build({ | |
// stdio: 'inherit', | |
minify: true, | |
entryPoints: ['./src/index.tsx'], | |
outfile: './public/bundle.js', | |
// minify: 'production' === env, | |
bundle: true, | |
format: 'esm', | |
define: { | |
"process.env.NODE_ENV": `'${env}'` | |
}, | |
// sourcemap: 'development' === env | |
}).catch((err) => { | |
console.log(err) | |
process.exit(1) | |
}) | |
} | |
chokidar.watch('./src/**', { | |
ignoreInitial: true, | |
}).on('all', (event, path) => { | |
console.log("✓ ", event, path); | |
runBuild() | |
}).on('ready', () => { | |
console.log("\n=====================================") | |
console.log("➢ 进入监控状态!Waiting for changes...") | |
console.log("======================================\n") | |
runServer() | |
runBuild() | |
}); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Show hidden characters
{ | |
"compilerOptions": { | |
"target": "es5", | |
"lib": [ | |
"dom", | |
"dom.iterable", | |
"esnext" | |
], | |
"allowJs": true, | |
"skipLibCheck": true, | |
"esModuleInterop": true, | |
"allowSyntheticDefaultImports": true, | |
"strict": true, | |
"forceConsistentCasingInFileNames": true, | |
"module": "esnext", | |
"moduleResolution": "node", | |
"resolveJsonModule": true, | |
"isolatedModules": true, | |
"noEmit": true, | |
"jsx": "react" | |
}, | |
"include": [ | |
"src" | |
] | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment