From 39a2645d658458193bc5672fc510802e07126b17 Mon Sep 17 00:00:00 2001 From: Aria Minaei Date: Fri, 18 Jun 2021 20:35:01 +0200 Subject: [PATCH] Simplify project config --- packages/playground/devEnv/servePlayground.ts | 1 - packages/playground/package.json | 1 + theatre/core/src/CoreBundle.ts | 2 +- theatre/core/src/coreExports.ts | 7 ++-- theatre/core/src/projects/Project.ts | 3 +- theatre/core/src/projects/TheatreProject.ts | 2 +- .../src/projects/initialiseProjectState.ts | 3 +- theatre/core/src/sequences/Sequence.ts | 10 +++--- theatre/core/src/sequences/TheatreSequence.ts | 2 +- .../core/src/sequences/trackValueAtTime.ts | 4 +-- .../src/sheetObjects/SheetObjectTemplate.ts | 2 +- theatre/devEnv/build.ts | 32 +++++++++++++++++ theatre/devEnv/webpack/createWebpackConfig.ts | 11 ++---- theatre/devEnv/webpack/production.js | 1 - theatre/globals.d.ts | 36 ++----------------- theatre/sample.env.json | 14 -------- theatre/shared/src/globals.ts | 6 ++++ theatre/shared/src/setupTestEnv.ts | 5 +-- theatre/shared/src/testUtils.ts | 3 +- theatre/shared/src/utils/react/hooks.ts | 2 +- .../shared/src/utils/redux/configureStore.ts | 4 +-- theatre/shared/src/utils/slashedPaths.ts | 2 +- theatre/studio/src/Studio.ts | 2 +- theatre/studio/src/StudioStore/StudioStore.ts | 3 +- .../src/StudioStore/persistStateOfStudio.ts | 4 ++- theatre/studio/src/UIRoot/UIRootWrapper.tsx | 2 +- theatre/studio/src/index.ts | 2 +- 27 files changed, 79 insertions(+), 87 deletions(-) create mode 100644 theatre/devEnv/build.ts delete mode 100644 theatre/sample.env.json create mode 100644 theatre/shared/src/globals.ts diff --git a/packages/playground/devEnv/servePlayground.ts b/packages/playground/devEnv/servePlayground.ts index 531a431..5c7f790 100644 --- a/packages/playground/devEnv/servePlayground.ts +++ b/packages/playground/devEnv/servePlayground.ts @@ -26,7 +26,6 @@ require('esbuild') sourcemap: true, define: { global: 'window', - '$env.isCore': false, ...convertObjectToWebpackDefinePaths({ process: {env: envConfig}, $env: envConfig, diff --git a/packages/playground/package.json b/packages/playground/package.json index 13f453b..d7468e0 100644 --- a/packages/playground/package.json +++ b/packages/playground/package.json @@ -5,6 +5,7 @@ "source": "src/index.tsx", "main": "dist/index.js", "types": "dist/index.d.ts", + "private": "true", "files": [ "dist/**/*" ], diff --git a/theatre/core/src/CoreBundle.ts b/theatre/core/src/CoreBundle.ts index 1597b4d..8b0e11e 100644 --- a/theatre/core/src/CoreBundle.ts +++ b/theatre/core/src/CoreBundle.ts @@ -14,7 +14,7 @@ export default class CoreBundle { } get version() { - return $env.version + return process.env.version } getBitsForStudio(studio: Studio, callback: (bits: CoreBits) => void) { diff --git a/theatre/core/src/coreExports.ts b/theatre/core/src/coreExports.ts index 0705d83..0e6592a 100644 --- a/theatre/core/src/coreExports.ts +++ b/theatre/core/src/coreExports.ts @@ -5,6 +5,7 @@ import type { IProjectConfig, } from '@theatre/core/projects/TheatreProject' import TheatreProject from '@theatre/core/projects/TheatreProject' +import globals from '@theatre/shared/globals' import * as types from '@theatre/shared/propTypes' import {InvalidArgumentError} from '@theatre/shared/utils/errors' import {validateName} from '@theatre/shared/utils/sanitizers' @@ -17,13 +18,13 @@ export function getProject(id: string, config: IProjectConfig = {}): IProject { return projectsSingleton.get(id)!.publicApi } - if ($env.NODE_ENV === 'development') { + if (process.env.NODE_ENV !== 'production') { validateName(id, 'projectName in Theatre.getProject(projectName)', true) validateProjectIdOrThrow(id) } if (config.state) { - if ($env.NODE_ENV === 'development') { + if (process.env.NODE_ENV !== 'production') { shallowValidateOnDiskState(id, config.state) } else { deepValidateOnDiskState(id, config.state) @@ -41,7 +42,7 @@ const shallowValidateOnDiskState = (projectId: string, s: OnDiskState) => { if ( Array.isArray(s) || s == null || - s.definitionVersion !== $env.currentProjectStateDefinitionVersion + s.definitionVersion !== globals.currentProjectStateDefinitionVersion ) { throw new InvalidArgumentError( `Error validating conf.state in Theatre.getProject(${JSON.stringify( diff --git a/theatre/core/src/projects/Project.ts b/theatre/core/src/projects/Project.ts index a857801..a2b74ed 100644 --- a/theatre/core/src/projects/Project.ts +++ b/theatre/core/src/projects/Project.ts @@ -12,6 +12,7 @@ import projectsSingleton from './projectsSingleton' import type {ProjectState} from './store/storeTypes' import type {Deferred} from '@theatre/shared/utils/defer' import {defer} from '@theatre/shared/utils/defer' +import globals from '@theatre/shared/globals' export type Conf = Partial<{ state: OnDiskState @@ -55,7 +56,7 @@ export default class Project { }, historic: config.state ?? { sheetsById: {}, - definitionVersion: $env.currentProjectStateDefinitionVersion, + definitionVersion: globals.currentProjectStateDefinitionVersion, }, ephemeral: { loadingState: { diff --git a/theatre/core/src/projects/TheatreProject.ts b/theatre/core/src/projects/TheatreProject.ts index 767e892..c448b51 100644 --- a/theatre/core/src/projects/TheatreProject.ts +++ b/theatre/core/src/projects/TheatreProject.ts @@ -52,7 +52,7 @@ export default class TheatreProject implements IProject { 'project.sheet', ) - if (!$env.isCore) { + if (process.env.NODE_ENV !== 'production') { validateName( instanceId, 'instanceId in project.sheet(sheetId, instanceId)', diff --git a/theatre/core/src/projects/initialiseProjectState.ts b/theatre/core/src/projects/initialiseProjectState.ts index 339d2bd..a2d7768 100644 --- a/theatre/core/src/projects/initialiseProjectState.ts +++ b/theatre/core/src/projects/initialiseProjectState.ts @@ -3,6 +3,7 @@ import delay from '@theatre/shared/utils/delay' import {original} from 'immer' import type Project from './Project' import type {OnDiskState} from './store/storeTypes' +import globals from '@theatre/shared/globals' /** * @todo this could be turned into a simple derivation, like: @@ -40,7 +41,7 @@ export default async function initialiseProjectState( drafts.historic.coreByProject[projectId] = { sheetsById: {}, - definitionVersion: $env.currentProjectStateDefinitionVersion, + definitionVersion: globals.currentProjectStateDefinitionVersion, } } diff --git a/theatre/core/src/sequences/Sequence.ts b/theatre/core/src/sequences/Sequence.ts index e65bdfb..8ec819f 100644 --- a/theatre/core/src/sequences/Sequence.ts +++ b/theatre/core/src/sequences/Sequence.ts @@ -107,7 +107,7 @@ export default class Sequence { set position(requestedPosition: number) { let position = requestedPosition this.pause() - if (!$env.isCore) { + if (process.env.NODE_ENV !== 'production') { if (typeof position !== 'number') { logger.error( `value t in sequence.position = t must be a number. ${typeof position} given`, @@ -164,7 +164,7 @@ export default class Sequence { end: sequenceDuration, } - if (!$env.isCore) { + if (process.env.NODE_ENV !== 'production') { if (typeof range.start !== 'number' || range.start < 0) { throw new InvalidArgumentError( `Argument conf.range.start in sequence.play(conf) must be a positive number. ${JSON.stringify( @@ -207,7 +207,7 @@ export default class Sequence { const iterationCount = conf && typeof conf.iterationCount === 'number' ? conf.iterationCount : 1 - if (!$env.isCore) { + if (process.env.NODE_ENV !== 'production') { if ( !(Number.isInteger(iterationCount) && iterationCount > 0) && iterationCount !== Infinity @@ -222,7 +222,7 @@ export default class Sequence { const rate = conf && typeof conf.rate !== 'undefined' ? conf.rate : 1 - if (!$env.isCore) { + if (process.env.NODE_ENV !== 'production') { if (typeof rate !== 'number' || rate === 0) { throw new InvalidArgumentError( `Argument conf.rate in sequence.play(conf) must be a number larger than 0. ${JSON.stringify( @@ -242,7 +242,7 @@ export default class Sequence { const direction = conf && conf.direction ? conf.direction : 'normal' - if (!$env.isCore) { + if (process.env.NODE_ENV !== 'production') { if (possibleDirections.indexOf(direction) === -1) { throw new InvalidArgumentError( `Argument conf.direction in sequence.play(conf) must be one of ${JSON.stringify( diff --git a/theatre/core/src/sequences/TheatreSequence.ts b/theatre/core/src/sequences/TheatreSequence.ts index 4773d0d..a54e25a 100644 --- a/theatre/core/src/sequences/TheatreSequence.ts +++ b/theatre/core/src/sequences/TheatreSequence.ts @@ -43,7 +43,7 @@ export default class TheatreSequence { if (privateAPI(this)._project.isReady()) { return privateAPI(this).play(conf) } else { - if (!$env.isCore) { + if (process.env.NODE_ENV !== 'production') { logger.warn( `You seem to have called sequence.play() before the project has finished loading.\n` + `This would **not** a problem in production when using '@theatre/core', since Theatre loads instantly in core mode. ` + diff --git a/theatre/core/src/sequences/trackValueAtTime.ts b/theatre/core/src/sequences/trackValueAtTime.ts index 9522bf9..0a1dbc1 100644 --- a/theatre/core/src/sequences/trackValueAtTime.ts +++ b/theatre/core/src/sequences/trackValueAtTime.ts @@ -81,7 +81,7 @@ const pp = ( const currentKeyframe = track.keyframes[currentKeyframeIndex] if (!currentKeyframe) { - if ($env.NODE_ENV === 'development') { + if (process.env.NODE_ENV !== 'production') { logger.error(`Bug here`) } return states.error @@ -93,7 +93,7 @@ const pp = ( if (currentKeyframeIndex === 0) { return states.beforeFirstKeyframe(currentKeyframe) } else { - if ($env.NODE_ENV === 'development') { + if (process.env.NODE_ENV !== 'production') { logger.error(`Bug here`) } return states.error diff --git a/theatre/core/src/sheetObjects/SheetObjectTemplate.ts b/theatre/core/src/sheetObjects/SheetObjectTemplate.ts index 38de081..bc076b6 100644 --- a/theatre/core/src/sheetObjects/SheetObjectTemplate.ts +++ b/theatre/core/src/sheetObjects/SheetObjectTemplate.ts @@ -180,7 +180,7 @@ export default class SheetObjectTemplate { * Not available in core. */ getMapOfValidSequenceTracks_forStudio(): IDerivation { - if (!$env.isCore) { + if (process.env.NODE_ENV !== 'production') { return this._cache.get('getMapOfValidSequenceTracks_forStudio', () => this.getArrayOfValidSequenceTracks().map((arr) => { let map = {} diff --git a/theatre/devEnv/build.ts b/theatre/devEnv/build.ts new file mode 100644 index 0000000..3d230ec --- /dev/null +++ b/theatre/devEnv/build.ts @@ -0,0 +1,32 @@ +import path from 'path' +import { + convertObjectToWebpackDefinePaths, + getEnvConfig, +} from './webpack/createWebpackConfig' + +const playgroundDir = path.join(__dirname, '..') + +const envConfig = getEnvConfig(true) + +require('esbuild').serve( + { + port, + servedir: path.join(playgroundDir, 'src'), + }, + { + entryPoints: [path.join(playgroundDir, 'src/index.tsx')], + target: ['firefox88'], + loader: {'.png': 'file'}, + // outdir: '.', + // watch: true, + bundle: true, + sourcemap: true, + define: { + global: 'window', + ...convertObjectToWebpackDefinePaths({ + process: {env: envConfig}, + 'process.env': envConfig, + }), + }, + }, +) diff --git a/theatre/devEnv/webpack/createWebpackConfig.ts b/theatre/devEnv/webpack/createWebpackConfig.ts index a97ad19..98d5186 100644 --- a/theatre/devEnv/webpack/createWebpackConfig.ts +++ b/theatre/devEnv/webpack/createWebpackConfig.ts @@ -24,7 +24,6 @@ export default (type: 'playground' | 'development' | 'production') => { return bundles.map((which) => { const envConfig = getEnvConfig(isDev) - envConfig.isCore = which === 'core' envConfig.version = require('../../package.json').version const packageRoot = path.join( privatePackageRoot, @@ -175,12 +174,6 @@ export default (type: 'playground' | 'development' | 'production') => { } } - if (which === 'core') { - config.plugins!.push( - new webpack.DefinePlugin({'$env.isCore': JSON.stringify(true)}), - ) - } - if (!isDev) { config.stats = { // @ts-ignore @@ -196,12 +189,12 @@ export default (type: 'playground' | 'development' | 'production') => { } } - // defined process.env and $env + // defined process.env and process.env config.plugins!.push( new webpack.DefinePlugin( convertObjectToWebpackDefinePaths({ process: {env: envConfig}, - $env: envConfig, + 'process.env': envConfig, }), ), ) diff --git a/theatre/devEnv/webpack/production.js b/theatre/devEnv/webpack/production.js index 6dbce26..c98272a 100644 --- a/theatre/devEnv/webpack/production.js +++ b/theatre/devEnv/webpack/production.js @@ -2,5 +2,4 @@ require('ts-node').register({transpileOnly: true, skipProject: true}) const createWebpackConfigObject = require('./createWebpackConfig') -// @ts-ignore module.exports = createWebpackConfigObject('production') diff --git a/theatre/globals.d.ts b/theatre/globals.d.ts index 0b700d0..b22bea7 100644 --- a/theatre/globals.d.ts +++ b/theatre/globals.d.ts @@ -8,43 +8,11 @@ interface NodeModule { } } -// First, the env variables that exist regardless of the value of NODE_ENV -type CommonEnvironmentVariables = { +interface ProcessEnv { + NODE_ENV: 'development' | 'production' | 'test' version: string - isCore: boolean - studioPersistenceKey: string - currentProjectStateDefinitionVersion: string - disableStatePersistence?: boolean } -// Some environment variables are specific to NODE_ENV='development' -type DevSpecificEnvironmentVariables = { - NODE_ENV: 'development' - devSpecific: { - devServerHost: string - devServerSSL?: { - useSSL?: boolean - pathToKey: string - pathToCert: string - } - } -} - -type TestSpecificEnvironmentVariables = { - NODE_ENV: 'test' -} - -type ProductionSpecificEnvironmentVariables = { - NODE_ENV: 'production' -} - -type EnvironmentVariables = - | (CommonEnvironmentVariables & DevSpecificEnvironmentVariables) - | (CommonEnvironmentVariables & ProductionSpecificEnvironmentVariables) - | (CommonEnvironmentVariables & TestSpecificEnvironmentVariables) - -declare let $env: EnvironmentVariables - declare module '*.svg' { var s: string export default s diff --git a/theatre/sample.env.json b/theatre/sample.env.json deleted file mode 100644 index 5928aa5..0000000 --- a/theatre/sample.env.json +++ /dev/null @@ -1,14 +0,0 @@ -{ - "NODE_ENV": "development", - "studioPersistenceKey": "theatrejs:0.3/studio", - "currentProjectStateDefinitionVersion": "0.3.0-dev", - "devSpecific": { - "devServerHost": "localhost", - "devServerSSL": { - "useSSL": false, - "pathToKey": "/path/to/cert.key", - "pathToCert": "/path/to/cert.pem" - }, - "devServerPort": 10022 - } -} diff --git a/theatre/shared/src/globals.ts b/theatre/shared/src/globals.ts new file mode 100644 index 0000000..fde07f6 --- /dev/null +++ b/theatre/shared/src/globals.ts @@ -0,0 +1,6 @@ +const globals = { + disableStatePersistence: false, + currentProjectStateDefinitionVersion: '0.3.0-dev', +} + +export default globals diff --git a/theatre/shared/src/setupTestEnv.ts b/theatre/shared/src/setupTestEnv.ts index ee8be4a..5f8b0af 100644 --- a/theatre/shared/src/setupTestEnv.ts +++ b/theatre/shared/src/setupTestEnv.ts @@ -1,2 +1,3 @@ -// @ts-expect-error ignore -global.$env = {disableStatePersistence: true, ...process.env, isCore: false} +import globals from './globals' + +globals.disableStatePersistence = true diff --git a/theatre/shared/src/testUtils.ts b/theatre/shared/src/testUtils.ts index 0dfeba0..0a0490e 100644 --- a/theatre/shared/src/testUtils.ts +++ b/theatre/shared/src/testUtils.ts @@ -7,12 +7,13 @@ import type {SheetState_Historic} from '@theatre/core/projects/store/types/Sheet import * as t from '@theatre/shared/propTypes' import getStudio from '@theatre/studio/getStudio' import coreTicker from '@theatre/core/coreTicker' +import globals from './globals' /* eslint-enable no-restricted-syntax */ let lastProjectN = 0 export async function setupTestSheet(sheetState: SheetState_Historic) { const projectState: ProjectState_Historic = { - definitionVersion: $env.currentProjectStateDefinitionVersion, + definitionVersion: globals.currentProjectStateDefinitionVersion, sheetsById: { Sheet: sheetState, }, diff --git a/theatre/shared/src/utils/react/hooks.ts b/theatre/shared/src/utils/react/hooks.ts index 8a44acd..55c59aa 100644 --- a/theatre/shared/src/utils/react/hooks.ts +++ b/theatre/shared/src/utils/react/hooks.ts @@ -12,7 +12,7 @@ export function useForceUpdate(debugLabel?: string) { const [, setTick] = useState(0) const update = useCallback(() => { - if ($env.NODE_ENV === 'development' && debugLabel) + if (process.env.NODE_ENV !== 'production' && debugLabel) logger.log(debugLabel, 'forceUpdate', {trace: new Error()}) setTick((tick) => tick + 1) diff --git a/theatre/shared/src/utils/redux/configureStore.ts b/theatre/shared/src/utils/redux/configureStore.ts index 9bae350..fbe46cd 100644 --- a/theatre/shared/src/utils/redux/configureStore.ts +++ b/theatre/shared/src/utils/redux/configureStore.ts @@ -16,9 +16,9 @@ export default function configureStore(conf: Conf): Store { // const middlewares: $FixMe[] = [] const enhancers = [] - if ($env.NODE_ENV === 'development') { + if (process.env.NODE_ENV !== 'production') { const devtoolsEnhancer: $IntentionalAny = - $env.NODE_ENV === 'development' && + process.env.NODE_ENV !== 'production' && typeof window === 'object' && window.__REDUX_DEVTOOLS_EXTENSION__ ? window.__REDUX_DEVTOOLS_EXTENSION__(conf.devtoolsOptions) diff --git a/theatre/shared/src/utils/slashedPaths.ts b/theatre/shared/src/utils/slashedPaths.ts index b1921da..42c4d37 100644 --- a/theatre/shared/src/utils/slashedPaths.ts +++ b/theatre/shared/src/utils/slashedPaths.ts @@ -26,7 +26,7 @@ export function validateAndSanitiseSlashedPathOrThrow( fnName: string, ) { const sanitisedPath = sanifySlashedPath(unsanitisedPath) - if ($env.isCore) { + if (process.env.NODE_ENV !== 'development') { return sanitisedPath } const validation = getValidationErrorsOfSlashedPath(sanitisedPath) diff --git a/theatre/studio/src/Studio.ts b/theatre/studio/src/Studio.ts index 04ffd81..a851088 100644 --- a/theatre/studio/src/Studio.ts +++ b/theatre/studio/src/Studio.ts @@ -32,7 +32,7 @@ export default class Studio { this.publicApi = new TheatreStudio(this) this.atomP = this._store.atomP - if ($env.NODE_ENV !== 'test') { + if (process.env.NODE_ENV !== 'test') { this.ui = new UI(this) } diff --git a/theatre/studio/src/StudioStore/StudioStore.ts b/theatre/studio/src/StudioStore/StudioStore.ts index c1c1ee6..f1b3577 100644 --- a/theatre/studio/src/StudioStore/StudioStore.ts +++ b/theatre/studio/src/StudioStore/StudioStore.ts @@ -26,6 +26,7 @@ import get from 'lodash-es/get' import type {Store} from 'redux' import {persistStateOfStudio} from './persistStateOfStudio' import {isSheetObject} from '@theatre/shared/instanceTypes' +import globals from '@theatre/shared/globals' export type Drafts = { historic: Draft @@ -59,7 +60,7 @@ export default class StudioStore { this._atom = atomFromReduxStore(this._reduxStore) this.atomP = this._atom.pointer - if ($env.disableStatePersistence !== true) { + if (globals.disableStatePersistence !== true) { const d = defer() this.initialized = d.promise persistStateOfStudio(this._reduxStore, () => { diff --git a/theatre/studio/src/StudioStore/persistStateOfStudio.ts b/theatre/studio/src/StudioStore/persistStateOfStudio.ts index 2f6e4f3..0b291a5 100644 --- a/theatre/studio/src/StudioStore/persistStateOfStudio.ts +++ b/theatre/studio/src/StudioStore/persistStateOfStudio.ts @@ -5,6 +5,8 @@ import type {FullStudioState} from '@theatre/studio/store/index' import debounce from 'lodash-es/debounce' import type {Store} from 'redux' +const studioPersistenceKey = 'theatrejs:0.3/studio' + export const persistStateOfStudio = ( reduxStore: Store, onInitialize: () => void, @@ -13,7 +15,7 @@ export const persistStateOfStudio = ( reduxStore.dispatch(studioActions.replacePersistentState(s)) } - const storageKey = $env.studioPersistenceKey + '.persistent' + const storageKey = studioPersistenceKey + '.persistent' const getState = () => reduxStore.getState().$persistent loadFromPersistentStorage() diff --git a/theatre/studio/src/UIRoot/UIRootWrapper.tsx b/theatre/studio/src/UIRoot/UIRootWrapper.tsx index 234180c..3f6d594 100644 --- a/theatre/studio/src/UIRoot/UIRootWrapper.tsx +++ b/theatre/studio/src/UIRoot/UIRootWrapper.tsx @@ -9,7 +9,7 @@ export default class UIRootWrapper extends React.Component<{ componentDidMount() { const self = this if ( - $env.NODE_ENV === 'development' && + process.env.NODE_ENV !== 'production' && typeof module === 'object' && module && module.hot diff --git a/theatre/studio/src/index.ts b/theatre/studio/src/index.ts index f815278..78e78ac 100644 --- a/theatre/studio/src/index.ts +++ b/theatre/studio/src/index.ts @@ -11,7 +11,7 @@ const studioPrivateAPI = new Studio() export const studio = studioPrivateAPI.publicApi export default studio -if ($env.NODE_ENV !== 'test') { +if (process.env.NODE_ENV !== 'test') { studio.ui.show() }