- Add to
index.html
<head>
...
<script type="application/javascript">
var global = window;
</script>
<script type="module">
import { Buffer } from "buffer";
window.Buffer = Buffer;
</script>
</head>
- Update
vite.config.ts
import react from '@vitejs/plugin-react';
import path from 'path';
import { defineConfig } from 'vite';
import eslint from 'vite-plugin-eslint';
export default defineConfig(() => {
return {
resolve: {
alias: {
'@': path.resolve(__dirname, './src'),
buffer: 'rollup-plugin-node-polyfills/polyfills/buffer-es6',
},
},
define: {
// By default, Vite doesn't include shims for NodeJS/
// necessary for segment analytics lib to work
'window.global': {},
// https://github.com/vitejs/vite/issues/1973#issuecomment-787571499
'process.env': {},
},
build: {
outDir: 'build',
},
plugins: [react(), eslint()],
};
});
- Install packages:
pnpm add -D rollup-plugin-node-polyfills vite-plugin-eslint
Makefile content:
-include .env # include environment variables from .env file, if the file exists
install:
pnpm install
build:
pnpm build
deploy:
aws s3 sync ./build/ s3://${S3_BUCKET_ID} --delete
aws cloudfront create-invalidation --distribution-id ${CLOUDFRONT_DISTRIBUTION_ID} --paths "/*"