diff --git a/discovery-client/Makefile b/discovery-client/Makefile index f83ea91dba0..e19b6b7fecd 100644 --- a/discovery-client/Makefile +++ b/discovery-client/Makefile @@ -26,7 +26,7 @@ lib: export NODE_ENV := production lib: $(main_out) $(cli_out) $(main_out) $(cli_out): - pnpm webpack + pnpm vite build .PHONY: test test: diff --git a/discovery-client/vite.config.ts b/discovery-client/vite.config.ts new file mode 100644 index 00000000000..7cbd9ae43c3 --- /dev/null +++ b/discovery-client/vite.config.ts @@ -0,0 +1,79 @@ +import { versionForProject } from '../scripts/git-version' +import pkg from './package.json' +import path from 'path' +import { UserConfig, defineConfig } from 'vite' +import react from '@vitejs/plugin-react' +import postCssImport from 'postcss-import' +import postCssApply from 'postcss-apply' +import postColorModFunction from 'postcss-color-mod-function' +import postCssPresetEnv from 'postcss-preset-env' +import lostCss from 'lost' + +export default defineConfig( + async (): Promise => { + const project = process.env.OPENTRONS_PROJECT ?? 'robot-stack' + const version = await versionForProject(project) + return { + publicDir: false, + build: { + // Relative to the root + ssr: 'src/index.ts', + outDir: 'lib', + commonjsOptions: { + transformMixedEsModules: true, + esmExternals: true, + }, + }, + plugins: [ + react({ + include: '**/*.tsx', + babel: { + // Use babel.config.js files + configFile: true, + }, + }), + ], + optimizeDeps: { + esbuildOptions: { + target: 'CommonJs', + }, + }, + css: { + postcss: { + plugins: [ + postCssImport({ root: 'src/' }), + postCssApply(), + postColorModFunction(), + postCssPresetEnv({ stage: 0 }), + lostCss(), + ], + }, + }, + define: { + 'process.env': process.env, + global: 'globalThis', + _PKG_VERSION_: JSON.stringify(version), + _PKG_BUGS_URL_: JSON.stringify(pkg.bugs.url), + _OPENTRONS_PROJECT_: JSON.stringify(project), + }, + resolve: { + alias: { + '@opentrons/components/styles': path.resolve( + '../components/src/index.module.css' + ), + '@opentrons/components': path.resolve('../components/src/index.ts'), + '@opentrons/shared-data': path.resolve('../shared-data/js/index.ts'), + '@opentrons/step-generation': path.resolve( + '../step-generation/src/index.ts' + ), + '@opentrons/discovery-client': path.resolve( + '../discovery-client/src/index.ts' + ), + '@opentrons/usb-bridge/node-client': path.resolve( + '../usb-bridge/node-client/src/index.ts' + ), + }, + }, + } + } +) diff --git a/labware-designer/babel.config.cjs b/labware-designer/babel.config.cjs new file mode 100644 index 00000000000..7632520dfc9 --- /dev/null +++ b/labware-designer/babel.config.cjs @@ -0,0 +1,21 @@ +'use strict' + +module.exports = { + env: { + // Note(isk: 3/2/20): Must have babel-plugin-styled-components in each env, + // see here for further details: s https://styled-components.com/docs/tooling#babel-plugin + production: { + plugins: ['babel-plugin-styled-components', 'babel-plugin-unassert'], + }, + development: { + plugins: ['babel-plugin-styled-components'], + }, + test: { + plugins: [ + // NOTE(mc, 2020-05-08): disable ssr, displayName to fix toHaveStyleRule + // https://github.com/styled-components/jest-styled-components/issues/294 + ['babel-plugin-styled-components', { ssr: false, displayName: false }], + ], + }, + }, +} diff --git a/labware-designer/index.html b/labware-designer/index.html new file mode 100644 index 00000000000..1429fd3f833 --- /dev/null +++ b/labware-designer/index.html @@ -0,0 +1,16 @@ + + + + + + + + + + Vite + React + TS + + +
+ + + diff --git a/labware-designer/src/organisms/CreateLabwareSandbox/index.tsx b/labware-designer/src/organisms/CreateLabwareSandbox/index.tsx index b619f3abb6f..998254c1bb7 100644 --- a/labware-designer/src/organisms/CreateLabwareSandbox/index.tsx +++ b/labware-designer/src/organisms/CreateLabwareSandbox/index.tsx @@ -22,13 +22,14 @@ import { createIrregularLabware, createRegularLabware, getPositionFromSlotId, + ot2StandardDeckV4, } from '@opentrons/shared-data' -import standardDeckDef from '@opentrons/shared-data/deck/definitions/4/ot2_standard.json' + import { IRREGULAR_OPTIONS, REGULAR_OPTIONS } from './fixtures' import type { DeckDefinition, LabwareDefinition2 } from '@opentrons/shared-data' -const SLOT_OPTIONS = standardDeckDef.locations.addressableAreas.map( +const SLOT_OPTIONS = ot2StandardDeckV4.locations.addressableAreas.map( slot => slot.id ) const DEFAULT_LABWARE_SLOT = SLOT_OPTIONS[0] @@ -181,13 +182,13 @@ export function CreateLabwareSandbox(): JSX.Element { {viewOnDeck ? ( {() => { const lwPosition = getPositionFromSlotId( labwareSlot, - (standardDeckDef as unknown) as DeckDefinition + (ot2StandardDeckV4 as unknown) as DeckDefinition ) return (