0
0
mirror of https://github.com/PostHog/posthog.git synced 2024-11-22 08:40:03 +01:00
posthog/frontend/build.mjs

69 lines
1.9 KiB
JavaScript
Raw Normal View History

Bundle our frontend via esbuild (#6758) * esbuild package * almost get esbuild working * fix react-virtualized imports * add splitting * fix funny import reorder bug * fix squeakAudio referring to itself * write index.html file * fix some bad imports * update antd paths * remove raw-loader usage, it didn't work anyway * refactor and copy public * build app and toolbar * get toolbar working, but without styles * make toolbar and its styles work * shared dashboards * clean frontend build before rebuilding * add watch mode * reorder tasks * revert js url * incremental builds of app with debounced chokidar watching * common build/watch script * improve logs * watch during firrst build * fix toolbar url * fix wrongly exported scene * create sceneProxyLogic to untangle sceneLogic from all bundles * disconnect sceneLogic and refactor setPageTitle * live reloading server * rename utils file * only wait for /static * fix encoding * simplify * add missing dayjs plugins * fix pathless logics * simplify options * add jsx for webapck * slight delay to catch changes * a type is a type * fix build * esbuild in start * funnelLogic path * include all files with a "." (so .mjs, etc) in /frontend/ to docker * rename to "utils.mjs", make "build.mjs" executable * improve erroring * revert some needless changes * more reverts * change some scripts * remove setuff * clarify function * make "--host 0.0.0.0" work * fix import order issue in webpack * remove webpack css inlining for toolbar to simplify config * make toolbar with external styles work in storybook * move live server injection into django * fix undefined bug * simplify setup to work with injection directly in http://localhost:8000 (no proxying needed on :8234) * add comments * Fix `fse` usage I was getting this otherwise: $ node frontend/build.mjs file:///Users/twixes/Developer/posthog/frontend/utils.mjs:46 fse.copySync(srcDir, destDir, { overwrite: true }, function (err) { ^ TypeError: fse.copySync is not a function at copyPublicFolder (file:///Users/twixes/Developer/posthog/frontend/utils.mjs:46:9) at file:///Users/twixes/Developer/posthog/frontend/build.mjs:5:1 at ModuleJob.run (internal/modules/esm/module_job.js:146:23) at async Loader.import (internal/modules/esm/loader.js:165:24) at async Object.loadESM (internal/process/esm_loader.js:68:5) * Mock `process` for VFile used by ReactMarkdown I was getting this otherwise: core.js:55 Uncaught ReferenceError: process is not defined at new VFile (core.js:55) at VFile (core.js:49) at Function.parse (index.js:273) at ReactMarkdown2 (react-markdown.js:42) at renderWithHooks (react-dom.development.js:14803) at mountIndeterminateComponent (react-dom.development.js:17482) at beginWork (react-dom.development.js:18596) at HTMLUnknownElement.callCallback2 (react-dom.development.js:188) at Object.invokeGuardedCallbackDev (react-dom.development.js:237) at invokeGuardedCallback (react-dom.development.js:292) * Mock `process.env` for VFile used by ReactMarkdown I was getting this otherwise: platform.ts:73 Uncaught TypeError: Cannot read properties of undefined (reading 'ENABLE_VSCODE_BROWSER_CODE_LOADING') at platform.ts:73 at platform.ts:79 at Function.r._invokeFactory (loader.js:1118) at r.complete (loader.js:1128) at r._onModuleComplete (loader.js:1754) at r._resolve (loader.js:1714) at r.defineModule (loader.js:1357) at _ (loader.js:1804) at numbers.ts:10 at fake:1 * pass the heavy appScenes to sceneLogic through props via App.tsx * remove sceneProxyLogic * remove exported variables * fix sceneLogic test Co-authored-by: Michael Matloka <dev@twixes.com>
2021-11-03 09:50:24 +01:00
#!/usr/bin/env node
import * as path from 'path'
import { __dirname, copyIndexHtml, copyPublicFolder, buildOrWatch, isDev, startServer } from './utils.mjs'
function writeIndexHtml(chunks = {}) {
copyIndexHtml('src/index.html', 'dist/index.html', 'index', chunks)
copyIndexHtml('src/layout.html', 'dist/layout.html', 'index', chunks)
copyIndexHtml('src/shared_dashboard.html', 'dist/shared_dashboard.html', 'shared_dashboard', chunks)
}
Bundle our frontend via esbuild (#6758) * esbuild package * almost get esbuild working * fix react-virtualized imports * add splitting * fix funny import reorder bug * fix squeakAudio referring to itself * write index.html file * fix some bad imports * update antd paths * remove raw-loader usage, it didn't work anyway * refactor and copy public * build app and toolbar * get toolbar working, but without styles * make toolbar and its styles work * shared dashboards * clean frontend build before rebuilding * add watch mode * reorder tasks * revert js url * incremental builds of app with debounced chokidar watching * common build/watch script * improve logs * watch during firrst build * fix toolbar url * fix wrongly exported scene * create sceneProxyLogic to untangle sceneLogic from all bundles * disconnect sceneLogic and refactor setPageTitle * live reloading server * rename utils file * only wait for /static * fix encoding * simplify * add missing dayjs plugins * fix pathless logics * simplify options * add jsx for webapck * slight delay to catch changes * a type is a type * fix build * esbuild in start * funnelLogic path * include all files with a "." (so .mjs, etc) in /frontend/ to docker * rename to "utils.mjs", make "build.mjs" executable * improve erroring * revert some needless changes * more reverts * change some scripts * remove setuff * clarify function * make "--host 0.0.0.0" work * fix import order issue in webpack * remove webpack css inlining for toolbar to simplify config * make toolbar with external styles work in storybook * move live server injection into django * fix undefined bug * simplify setup to work with injection directly in http://localhost:8000 (no proxying needed on :8234) * add comments * Fix `fse` usage I was getting this otherwise: $ node frontend/build.mjs file:///Users/twixes/Developer/posthog/frontend/utils.mjs:46 fse.copySync(srcDir, destDir, { overwrite: true }, function (err) { ^ TypeError: fse.copySync is not a function at copyPublicFolder (file:///Users/twixes/Developer/posthog/frontend/utils.mjs:46:9) at file:///Users/twixes/Developer/posthog/frontend/build.mjs:5:1 at ModuleJob.run (internal/modules/esm/module_job.js:146:23) at async Loader.import (internal/modules/esm/loader.js:165:24) at async Object.loadESM (internal/process/esm_loader.js:68:5) * Mock `process` for VFile used by ReactMarkdown I was getting this otherwise: core.js:55 Uncaught ReferenceError: process is not defined at new VFile (core.js:55) at VFile (core.js:49) at Function.parse (index.js:273) at ReactMarkdown2 (react-markdown.js:42) at renderWithHooks (react-dom.development.js:14803) at mountIndeterminateComponent (react-dom.development.js:17482) at beginWork (react-dom.development.js:18596) at HTMLUnknownElement.callCallback2 (react-dom.development.js:188) at Object.invokeGuardedCallbackDev (react-dom.development.js:237) at invokeGuardedCallback (react-dom.development.js:292) * Mock `process.env` for VFile used by ReactMarkdown I was getting this otherwise: platform.ts:73 Uncaught TypeError: Cannot read properties of undefined (reading 'ENABLE_VSCODE_BROWSER_CODE_LOADING') at platform.ts:73 at platform.ts:79 at Function.r._invokeFactory (loader.js:1118) at r.complete (loader.js:1128) at r._onModuleComplete (loader.js:1754) at r._resolve (loader.js:1714) at r.defineModule (loader.js:1357) at _ (loader.js:1804) at numbers.ts:10 at fake:1 * pass the heavy appScenes to sceneLogic through props via App.tsx * remove sceneProxyLogic * remove exported variables * fix sceneLogic test Co-authored-by: Michael Matloka <dev@twixes.com>
2021-11-03 09:50:24 +01:00
let pauseServer = () => {}
let resumeServer = () => {}
if (isDev) {
console.log(`👀 Starting dev server`)
const serverResponse = startServer()
pauseServer = serverResponse.pauseServer
resumeServer = serverResponse.resumeServer
} else {
console.log(`🛳 Starting production build`)
}
let buildsInProgress = 0
function onBuildStart() {
if (buildsInProgress === 0) {
pauseServer()
}
buildsInProgress++
}
function onBuildComplete(chunks) {
buildsInProgress--
if (buildsInProgress === 0) {
resumeServer()
writeIndexHtml(chunks)
}
}
copyPublicFolder()
writeIndexHtml({})
Bundle our frontend via esbuild (#6758) * esbuild package * almost get esbuild working * fix react-virtualized imports * add splitting * fix funny import reorder bug * fix squeakAudio referring to itself * write index.html file * fix some bad imports * update antd paths * remove raw-loader usage, it didn't work anyway * refactor and copy public * build app and toolbar * get toolbar working, but without styles * make toolbar and its styles work * shared dashboards * clean frontend build before rebuilding * add watch mode * reorder tasks * revert js url * incremental builds of app with debounced chokidar watching * common build/watch script * improve logs * watch during firrst build * fix toolbar url * fix wrongly exported scene * create sceneProxyLogic to untangle sceneLogic from all bundles * disconnect sceneLogic and refactor setPageTitle * live reloading server * rename utils file * only wait for /static * fix encoding * simplify * add missing dayjs plugins * fix pathless logics * simplify options * add jsx for webapck * slight delay to catch changes * a type is a type * fix build * esbuild in start * funnelLogic path * include all files with a "." (so .mjs, etc) in /frontend/ to docker * rename to "utils.mjs", make "build.mjs" executable * improve erroring * revert some needless changes * more reverts * change some scripts * remove setuff * clarify function * make "--host 0.0.0.0" work * fix import order issue in webpack * remove webpack css inlining for toolbar to simplify config * make toolbar with external styles work in storybook * move live server injection into django * fix undefined bug * simplify setup to work with injection directly in http://localhost:8000 (no proxying needed on :8234) * add comments * Fix `fse` usage I was getting this otherwise: $ node frontend/build.mjs file:///Users/twixes/Developer/posthog/frontend/utils.mjs:46 fse.copySync(srcDir, destDir, { overwrite: true }, function (err) { ^ TypeError: fse.copySync is not a function at copyPublicFolder (file:///Users/twixes/Developer/posthog/frontend/utils.mjs:46:9) at file:///Users/twixes/Developer/posthog/frontend/build.mjs:5:1 at ModuleJob.run (internal/modules/esm/module_job.js:146:23) at async Loader.import (internal/modules/esm/loader.js:165:24) at async Object.loadESM (internal/process/esm_loader.js:68:5) * Mock `process` for VFile used by ReactMarkdown I was getting this otherwise: core.js:55 Uncaught ReferenceError: process is not defined at new VFile (core.js:55) at VFile (core.js:49) at Function.parse (index.js:273) at ReactMarkdown2 (react-markdown.js:42) at renderWithHooks (react-dom.development.js:14803) at mountIndeterminateComponent (react-dom.development.js:17482) at beginWork (react-dom.development.js:18596) at HTMLUnknownElement.callCallback2 (react-dom.development.js:188) at Object.invokeGuardedCallbackDev (react-dom.development.js:237) at invokeGuardedCallback (react-dom.development.js:292) * Mock `process.env` for VFile used by ReactMarkdown I was getting this otherwise: platform.ts:73 Uncaught TypeError: Cannot read properties of undefined (reading 'ENABLE_VSCODE_BROWSER_CODE_LOADING') at platform.ts:73 at platform.ts:79 at Function.r._invokeFactory (loader.js:1118) at r.complete (loader.js:1128) at r._onModuleComplete (loader.js:1754) at r._resolve (loader.js:1714) at r.defineModule (loader.js:1357) at _ (loader.js:1804) at numbers.ts:10 at fake:1 * pass the heavy appScenes to sceneLogic through props via App.tsx * remove sceneProxyLogic * remove exported variables * fix sceneLogic test Co-authored-by: Michael Matloka <dev@twixes.com>
2021-11-03 09:50:24 +01:00
await Promise.all([
buildOrWatch({
name: 'PostHog App',
entryPoints: ['src/index.tsx'],
bundle: true,
splitting: true,
format: 'esm',
outdir: path.resolve(__dirname, 'dist'),
onBuildStart,
onBuildComplete,
Bundle our frontend via esbuild (#6758) * esbuild package * almost get esbuild working * fix react-virtualized imports * add splitting * fix funny import reorder bug * fix squeakAudio referring to itself * write index.html file * fix some bad imports * update antd paths * remove raw-loader usage, it didn't work anyway * refactor and copy public * build app and toolbar * get toolbar working, but without styles * make toolbar and its styles work * shared dashboards * clean frontend build before rebuilding * add watch mode * reorder tasks * revert js url * incremental builds of app with debounced chokidar watching * common build/watch script * improve logs * watch during firrst build * fix toolbar url * fix wrongly exported scene * create sceneProxyLogic to untangle sceneLogic from all bundles * disconnect sceneLogic and refactor setPageTitle * live reloading server * rename utils file * only wait for /static * fix encoding * simplify * add missing dayjs plugins * fix pathless logics * simplify options * add jsx for webapck * slight delay to catch changes * a type is a type * fix build * esbuild in start * funnelLogic path * include all files with a "." (so .mjs, etc) in /frontend/ to docker * rename to "utils.mjs", make "build.mjs" executable * improve erroring * revert some needless changes * more reverts * change some scripts * remove setuff * clarify function * make "--host 0.0.0.0" work * fix import order issue in webpack * remove webpack css inlining for toolbar to simplify config * make toolbar with external styles work in storybook * move live server injection into django * fix undefined bug * simplify setup to work with injection directly in http://localhost:8000 (no proxying needed on :8234) * add comments * Fix `fse` usage I was getting this otherwise: $ node frontend/build.mjs file:///Users/twixes/Developer/posthog/frontend/utils.mjs:46 fse.copySync(srcDir, destDir, { overwrite: true }, function (err) { ^ TypeError: fse.copySync is not a function at copyPublicFolder (file:///Users/twixes/Developer/posthog/frontend/utils.mjs:46:9) at file:///Users/twixes/Developer/posthog/frontend/build.mjs:5:1 at ModuleJob.run (internal/modules/esm/module_job.js:146:23) at async Loader.import (internal/modules/esm/loader.js:165:24) at async Object.loadESM (internal/process/esm_loader.js:68:5) * Mock `process` for VFile used by ReactMarkdown I was getting this otherwise: core.js:55 Uncaught ReferenceError: process is not defined at new VFile (core.js:55) at VFile (core.js:49) at Function.parse (index.js:273) at ReactMarkdown2 (react-markdown.js:42) at renderWithHooks (react-dom.development.js:14803) at mountIndeterminateComponent (react-dom.development.js:17482) at beginWork (react-dom.development.js:18596) at HTMLUnknownElement.callCallback2 (react-dom.development.js:188) at Object.invokeGuardedCallbackDev (react-dom.development.js:237) at invokeGuardedCallback (react-dom.development.js:292) * Mock `process.env` for VFile used by ReactMarkdown I was getting this otherwise: platform.ts:73 Uncaught TypeError: Cannot read properties of undefined (reading 'ENABLE_VSCODE_BROWSER_CODE_LOADING') at platform.ts:73 at platform.ts:79 at Function.r._invokeFactory (loader.js:1118) at r.complete (loader.js:1128) at r._onModuleComplete (loader.js:1754) at r._resolve (loader.js:1714) at r.defineModule (loader.js:1357) at _ (loader.js:1804) at numbers.ts:10 at fake:1 * pass the heavy appScenes to sceneLogic through props via App.tsx * remove sceneProxyLogic * remove exported variables * fix sceneLogic test Co-authored-by: Michael Matloka <dev@twixes.com>
2021-11-03 09:50:24 +01:00
}),
buildOrWatch({
name: 'Shared Dashboard',
entryPoints: ['src/scenes/dashboard/SharedDashboard.tsx'],
bundle: true,
format: 'iife',
outfile: path.resolve(__dirname, 'dist', 'shared_dashboard.js'),
onBuildStart,
onBuildComplete,
Bundle our frontend via esbuild (#6758) * esbuild package * almost get esbuild working * fix react-virtualized imports * add splitting * fix funny import reorder bug * fix squeakAudio referring to itself * write index.html file * fix some bad imports * update antd paths * remove raw-loader usage, it didn't work anyway * refactor and copy public * build app and toolbar * get toolbar working, but without styles * make toolbar and its styles work * shared dashboards * clean frontend build before rebuilding * add watch mode * reorder tasks * revert js url * incremental builds of app with debounced chokidar watching * common build/watch script * improve logs * watch during firrst build * fix toolbar url * fix wrongly exported scene * create sceneProxyLogic to untangle sceneLogic from all bundles * disconnect sceneLogic and refactor setPageTitle * live reloading server * rename utils file * only wait for /static * fix encoding * simplify * add missing dayjs plugins * fix pathless logics * simplify options * add jsx for webapck * slight delay to catch changes * a type is a type * fix build * esbuild in start * funnelLogic path * include all files with a "." (so .mjs, etc) in /frontend/ to docker * rename to "utils.mjs", make "build.mjs" executable * improve erroring * revert some needless changes * more reverts * change some scripts * remove setuff * clarify function * make "--host 0.0.0.0" work * fix import order issue in webpack * remove webpack css inlining for toolbar to simplify config * make toolbar with external styles work in storybook * move live server injection into django * fix undefined bug * simplify setup to work with injection directly in http://localhost:8000 (no proxying needed on :8234) * add comments * Fix `fse` usage I was getting this otherwise: $ node frontend/build.mjs file:///Users/twixes/Developer/posthog/frontend/utils.mjs:46 fse.copySync(srcDir, destDir, { overwrite: true }, function (err) { ^ TypeError: fse.copySync is not a function at copyPublicFolder (file:///Users/twixes/Developer/posthog/frontend/utils.mjs:46:9) at file:///Users/twixes/Developer/posthog/frontend/build.mjs:5:1 at ModuleJob.run (internal/modules/esm/module_job.js:146:23) at async Loader.import (internal/modules/esm/loader.js:165:24) at async Object.loadESM (internal/process/esm_loader.js:68:5) * Mock `process` for VFile used by ReactMarkdown I was getting this otherwise: core.js:55 Uncaught ReferenceError: process is not defined at new VFile (core.js:55) at VFile (core.js:49) at Function.parse (index.js:273) at ReactMarkdown2 (react-markdown.js:42) at renderWithHooks (react-dom.development.js:14803) at mountIndeterminateComponent (react-dom.development.js:17482) at beginWork (react-dom.development.js:18596) at HTMLUnknownElement.callCallback2 (react-dom.development.js:188) at Object.invokeGuardedCallbackDev (react-dom.development.js:237) at invokeGuardedCallback (react-dom.development.js:292) * Mock `process.env` for VFile used by ReactMarkdown I was getting this otherwise: platform.ts:73 Uncaught TypeError: Cannot read properties of undefined (reading 'ENABLE_VSCODE_BROWSER_CODE_LOADING') at platform.ts:73 at platform.ts:79 at Function.r._invokeFactory (loader.js:1118) at r.complete (loader.js:1128) at r._onModuleComplete (loader.js:1754) at r._resolve (loader.js:1714) at r.defineModule (loader.js:1357) at _ (loader.js:1804) at numbers.ts:10 at fake:1 * pass the heavy appScenes to sceneLogic through props via App.tsx * remove sceneProxyLogic * remove exported variables * fix sceneLogic test Co-authored-by: Michael Matloka <dev@twixes.com>
2021-11-03 09:50:24 +01:00
}),
buildOrWatch({
name: 'Toolbar',
entryPoints: ['src/toolbar/index.tsx'],
bundle: true,
format: 'iife',
outfile: path.resolve(__dirname, 'dist', 'toolbar.js'),
onBuildStart,
onBuildComplete,
Bundle our frontend via esbuild (#6758) * esbuild package * almost get esbuild working * fix react-virtualized imports * add splitting * fix funny import reorder bug * fix squeakAudio referring to itself * write index.html file * fix some bad imports * update antd paths * remove raw-loader usage, it didn't work anyway * refactor and copy public * build app and toolbar * get toolbar working, but without styles * make toolbar and its styles work * shared dashboards * clean frontend build before rebuilding * add watch mode * reorder tasks * revert js url * incremental builds of app with debounced chokidar watching * common build/watch script * improve logs * watch during firrst build * fix toolbar url * fix wrongly exported scene * create sceneProxyLogic to untangle sceneLogic from all bundles * disconnect sceneLogic and refactor setPageTitle * live reloading server * rename utils file * only wait for /static * fix encoding * simplify * add missing dayjs plugins * fix pathless logics * simplify options * add jsx for webapck * slight delay to catch changes * a type is a type * fix build * esbuild in start * funnelLogic path * include all files with a "." (so .mjs, etc) in /frontend/ to docker * rename to "utils.mjs", make "build.mjs" executable * improve erroring * revert some needless changes * more reverts * change some scripts * remove setuff * clarify function * make "--host 0.0.0.0" work * fix import order issue in webpack * remove webpack css inlining for toolbar to simplify config * make toolbar with external styles work in storybook * move live server injection into django * fix undefined bug * simplify setup to work with injection directly in http://localhost:8000 (no proxying needed on :8234) * add comments * Fix `fse` usage I was getting this otherwise: $ node frontend/build.mjs file:///Users/twixes/Developer/posthog/frontend/utils.mjs:46 fse.copySync(srcDir, destDir, { overwrite: true }, function (err) { ^ TypeError: fse.copySync is not a function at copyPublicFolder (file:///Users/twixes/Developer/posthog/frontend/utils.mjs:46:9) at file:///Users/twixes/Developer/posthog/frontend/build.mjs:5:1 at ModuleJob.run (internal/modules/esm/module_job.js:146:23) at async Loader.import (internal/modules/esm/loader.js:165:24) at async Object.loadESM (internal/process/esm_loader.js:68:5) * Mock `process` for VFile used by ReactMarkdown I was getting this otherwise: core.js:55 Uncaught ReferenceError: process is not defined at new VFile (core.js:55) at VFile (core.js:49) at Function.parse (index.js:273) at ReactMarkdown2 (react-markdown.js:42) at renderWithHooks (react-dom.development.js:14803) at mountIndeterminateComponent (react-dom.development.js:17482) at beginWork (react-dom.development.js:18596) at HTMLUnknownElement.callCallback2 (react-dom.development.js:188) at Object.invokeGuardedCallbackDev (react-dom.development.js:237) at invokeGuardedCallback (react-dom.development.js:292) * Mock `process.env` for VFile used by ReactMarkdown I was getting this otherwise: platform.ts:73 Uncaught TypeError: Cannot read properties of undefined (reading 'ENABLE_VSCODE_BROWSER_CODE_LOADING') at platform.ts:73 at platform.ts:79 at Function.r._invokeFactory (loader.js:1118) at r.complete (loader.js:1128) at r._onModuleComplete (loader.js:1754) at r._resolve (loader.js:1714) at r.defineModule (loader.js:1357) at _ (loader.js:1804) at numbers.ts:10 at fake:1 * pass the heavy appScenes to sceneLogic through props via App.tsx * remove sceneProxyLogic * remove exported variables * fix sceneLogic test Co-authored-by: Michael Matloka <dev@twixes.com>
2021-11-03 09:50:24 +01:00
}),
])