From 6539390ebe305fc7d8c22572c949d10de63d9427 Mon Sep 17 00:00:00 2001 From: dleadbetter <> Date: Thu, 29 Feb 2024 13:33:31 -0500 Subject: [PATCH] RC #251 - Adding Vite build to "semantic-ui", "shared", and "user-defined-fields" packages; Testing renaming "Object" to "ObjectJs" in "shared" package --- .flowconfig | 2 + packages/core-data/index.js | 1 - packages/semantic-ui/index.js | 1 - packages/semantic-ui/package.json | 29 +++++---- .../src/components/AccordionList.js | 2 +- .../semantic-ui/src/components/DataList.js | 2 +- .../semantic-ui/src/components/DataTable.js | 2 +- .../src/components/DataTableColumnSelector.js | 2 +- .../semantic-ui/src/components/ListTable.js | 2 +- packages/semantic-ui/vite.config.js | 59 +++++++++++++++++++ packages/semantic-ui/webpack.config.js | 36 ----------- packages/shared/index.js | 1 - packages/shared/package.json | 31 +++++++--- packages/shared/src/index.js | 2 +- packages/shared/vite.config.js | 49 +++++++++++++++ packages/shared/webpack.config.js | 13 ---- packages/storybook/.storybook/preview.js | 5 +- packages/storybook/package.json | 7 ++- packages/user-defined-fields/index.js | 1 - packages/user-defined-fields/package.json | 22 +++++-- packages/user-defined-fields/vite.config.js | 39 ++++++++++++ .../user-defined-fields/webpack.config.js | 3 - yarn.lock | 7 ++- 23 files changed, 228 insertions(+), 90 deletions(-) delete mode 100644 packages/core-data/index.js delete mode 100644 packages/semantic-ui/index.js create mode 100644 packages/semantic-ui/vite.config.js delete mode 100644 packages/semantic-ui/webpack.config.js delete mode 100644 packages/shared/index.js create mode 100644 packages/shared/vite.config.js delete mode 100644 packages/shared/webpack.config.js delete mode 100644 packages/user-defined-fields/index.js create mode 100644 packages/user-defined-fields/vite.config.js delete mode 100644 packages/user-defined-fields/webpack.config.js diff --git a/.flowconfig b/.flowconfig index 2129f764d..0c62c89b5 100644 --- a/.flowconfig +++ b/.flowconfig @@ -1,5 +1,7 @@ [ignore] /types/.* +/build/.* +/dist/.* ./node_modules/ [include] diff --git a/packages/core-data/index.js b/packages/core-data/index.js deleted file mode 100644 index e588b9ce8..000000000 --- a/packages/core-data/index.js +++ /dev/null @@ -1 +0,0 @@ -module.exports = require('./build/index'); diff --git a/packages/semantic-ui/index.js b/packages/semantic-ui/index.js deleted file mode 100644 index e588b9ce8..000000000 --- a/packages/semantic-ui/index.js +++ /dev/null @@ -1 +0,0 @@ -module.exports = require('./build/index'); diff --git a/packages/semantic-ui/package.json b/packages/semantic-ui/package.json index ad26a90e7..2eab43ce3 100644 --- a/packages/semantic-ui/package.json +++ b/packages/semantic-ui/package.json @@ -3,13 +3,19 @@ "version": "1.2.0-beta.29", "description": "A package of shared components based on the Semantic UI Framework.", "license": "MIT", - "main": "./build/index.js", - "style": [ - "./build/main.css", - "./build/semantic-ui.css" - ], + "main": "./dist/index.cjs.js", + "module": "./dist/index.es.js", + "style": "./dist/style.css", + "type": "module", + "exports": { + ".": { + "import": "./dist/index.es.js", + "require": "./dist/index.cjs.js" + }, + "./style.css": "./dist/style.css" + }, "scripts": { - "build": "webpack --mode production && flow-copy-source -v src types" + "build": "vite build && flow-copy-source -v src types" }, "dependencies": { "@performant-software/shared-components": "^1.2.0-beta.29", @@ -19,8 +25,6 @@ "rc-slider": "^10.2.0", "react-calendar": "^3.3.0", "react-color": "^2.18.1", - "react-dnd": "^11.1.3", - "react-dnd-html5-backend": "^11.1.3", "react-i18next": "^11.4.0", "react-pdf": "^7.1.1", "react-syntax-highlighter": "^15.5.0", @@ -34,15 +38,20 @@ "peerDependencies": { "@samvera/clover-iiif": "^2.3.2", "react": ">= 16.13.1 < 19.0.0", + "react-dnd": "^11.1.3", + "react-dnd-html5-backend": "^11.1.3", "react-dom": ">= 16.13.1 < 19.0.0" }, "devDependencies": { + "@bunchtogether/vite-plugin-flow": "^1.0.2", "@performant-software/webpack-config": "^1.0.0", + "@vitejs/plugin-react": "^4.2.1", "flow-copy-source": "^2.0.9", "less": "^4.1.2", "less-loader": "^11.0.0", "mini-css-extract-plugin": "^2.6.0", "react": "^18.2.0", - "react-dom": "^18.2.0" + "react-dom": "^18.2.0", + "vite": "^5.1.4" } -} \ No newline at end of file +} diff --git a/packages/semantic-ui/src/components/AccordionList.js b/packages/semantic-ui/src/components/AccordionList.js index 8f111650c..8b4468f0d 100644 --- a/packages/semantic-ui/src/components/AccordionList.js +++ b/packages/semantic-ui/src/components/AccordionList.js @@ -1,6 +1,6 @@ // @flow -import { Object as ObjectUtils, Timer } from '@performant-software/shared-components'; +import { ObjectJs as ObjectUtils, Timer } from '@performant-software/shared-components'; import React, { Component } from 'react'; import { Button, diff --git a/packages/semantic-ui/src/components/DataList.js b/packages/semantic-ui/src/components/DataList.js index 859f95e53..96cc84d31 100644 --- a/packages/semantic-ui/src/components/DataList.js +++ b/packages/semantic-ui/src/components/DataList.js @@ -1,6 +1,6 @@ // @flow -import { Object as ObjectUtils, Timer } from '@performant-software/shared-components'; +import { ObjectJs as ObjectUtils, Timer } from '@performant-software/shared-components'; import React, { Component, type ComponentType } from 'react'; import uuid from 'react-uuid'; import _ from 'underscore'; diff --git a/packages/semantic-ui/src/components/DataTable.js b/packages/semantic-ui/src/components/DataTable.js index e7a085994..013e790a2 100644 --- a/packages/semantic-ui/src/components/DataTable.js +++ b/packages/semantic-ui/src/components/DataTable.js @@ -1,6 +1,6 @@ // @flow -import { Browser, Object as ObjectUtils } from '@performant-software/shared-components'; +import { Browser, ObjectJs as ObjectUtils } from '@performant-software/shared-components'; import React, { Component, createRef, type Element } from 'react'; import { Checkbox, diff --git a/packages/semantic-ui/src/components/DataTableColumnSelector.js b/packages/semantic-ui/src/components/DataTableColumnSelector.js index 749b08770..3b6723df5 100644 --- a/packages/semantic-ui/src/components/DataTableColumnSelector.js +++ b/packages/semantic-ui/src/components/DataTableColumnSelector.js @@ -1,6 +1,6 @@ // @flow -import { Object as ObjectUtils } from '@performant-software/shared-components'; +import { ObjectJs as ObjectUtils } from '@performant-software/shared-components'; import React, { Component, type ComponentType, type Element } from 'react'; import { Checkbox, Dropdown, Icon } from 'semantic-ui-react'; import _ from 'underscore'; diff --git a/packages/semantic-ui/src/components/ListTable.js b/packages/semantic-ui/src/components/ListTable.js index 08aa41cb5..72334a682 100644 --- a/packages/semantic-ui/src/components/ListTable.js +++ b/packages/semantic-ui/src/components/ListTable.js @@ -1,6 +1,6 @@ // @flow -import { Hooks, Object as ObjectUtils } from '@performant-software/shared-components'; +import { Hooks, ObjectJs as ObjectUtils } from '@performant-software/shared-components'; import React, { useEffect } from 'react'; import _ from 'underscore'; import DataTable from './DataTable'; diff --git a/packages/semantic-ui/vite.config.js b/packages/semantic-ui/vite.config.js new file mode 100644 index 000000000..1d09db493 --- /dev/null +++ b/packages/semantic-ui/vite.config.js @@ -0,0 +1,59 @@ +// @flow + +import { flowPlugin, esbuildFlowPlugin } from '@bunchtogether/vite-plugin-flow'; +import react from '@vitejs/plugin-react'; +import { resolve } from 'path'; +import { defineConfig } from 'vite'; +import * as packageJson from './package.json'; + +const root = resolve(__dirname); + +export default defineConfig(() => ({ + esbuild: { + include: /\.js$/, + exclude: [], + loader: 'jsx', + }, + optimizeDeps: { + esbuildOptions: { + plugins: [esbuildFlowPlugin()] + } + }, + plugins: [ + react(), + flowPlugin() + ], + build: { + sourcemap: true, + lib: { + entry: './src/index.js', + formats: ['es', 'cjs'], + fileName: (format) => `index.${format}.js` + }, + rollupOptions: { + external: [ + ...Object.keys(packageJson.peerDependencies) + ], + output: { + preserveModules: true + } + } + }, + resolve: { + alias: { + '../../theme.config': resolve(root, '/src/css/theme.config'), + '../src/css/site': resolve(root, '/src/css/site'), + '../src/css/themes': resolve(root, '/src/css/themes'), + '~semantic-ui-less/theme.less': resolve(root, '../../node_modules/semantic-ui-less/theme.less'), + }, + }, + css: { + preprocessorOptions: { + less: { + math: 'always', + relativeUrls: true, + javascriptEnabled: true + }, + }, + } +})); diff --git a/packages/semantic-ui/webpack.config.js b/packages/semantic-ui/webpack.config.js deleted file mode 100644 index c32913f96..000000000 --- a/packages/semantic-ui/webpack.config.js +++ /dev/null @@ -1,36 +0,0 @@ -const { configure } = require('@performant-software/webpack-config'); -const path = require('path'); - -module.exports = configure(__dirname, { - externals: [ - '@samvera/clover-iiif' - ], - resolve: { - alias: { - '../../theme.config$': path.join(__dirname, '/src/css/theme.config'), - '../src/css/site': path.join(__dirname, '/src/css/site'), - '../src/css/themes': path.join(__dirname, '/src/css/themes'), - './react-calendar/dist/Calendar.css$': path.resolve( - __dirname, - '../../node_modules/react-calendar/dist/Calendar.css' - ) - } - }, - optimization: { - splitChunks: { - cacheGroups: { - semantic: { - name: 'semantic-ui', - test: /\.less$/, - chunks: 'all', - enforce: true - }, - main: { - name: 'main', - chunks: 'all', - enforce: true - } - } - } - } -}); diff --git a/packages/shared/index.js b/packages/shared/index.js deleted file mode 100644 index e588b9ce8..000000000 --- a/packages/shared/index.js +++ /dev/null @@ -1 +0,0 @@ -module.exports = require('./build/index'); diff --git a/packages/shared/package.json b/packages/shared/package.json index 8b03f0d80..df2909362 100644 --- a/packages/shared/package.json +++ b/packages/shared/package.json @@ -3,20 +3,27 @@ "version": "1.2.0-beta.29", "description": "A package of shared, framework agnostic, components.", "license": "MIT", - "main": "./build/index.js", - "style": "./build/main.css", + "type": "module", + "main": "./dist/index.cjs.js", + "module": "./dist/index.es.js", + "style": "./dist/style.css", + "exports": { + ".": { + "import": "./dist/index.es.js", + "require": "./dist/index.cjs.js" + }, + "./style.css": "./dist/style.css" + }, "scripts": { - "build": "webpack --mode production && flow-copy-source -v src types" + "build": "vite build && flow-copy-source -v src types" }, "dependencies": { "@react-google-maps/api": "^2.8.1", "axios": "^0.26.1", "citeproc": "^2.4.62", "i18next": "^19.4.4", - "moment": "^2.30.1", + "moment": "2.18.1", "moment-islamic-civil": "ACGC/moment-islamic-civil", - "react-dnd": "^11.1.3", - "react-dnd-html5-backend": "^11.1.3", "react-fast-compare": "^3.2.0", "react-ga4": "^1.4.1", "react-i18next": "^11.4.0", @@ -28,11 +35,19 @@ }, "peerDependencies": { "react": ">= 16.13.1 < 19.0.0", + "react-dnd": "^11.1.3", + "react-dnd-html5-backend": "^11.1.3", "react-dom": ">= 16.13.1 < 19.0.0" }, "devDependencies": { + "@bunchtogether/vite-plugin-flow": "^1.0.2", "@performant-software/webpack-config": "^1.0.0", + "@vitejs/plugin-react": "^4.2.1", "react": "^18.2.0", - "react-dom": "^18.2.0" + "react-dom": "^18.2.0", + "vite": "^5.1.4" + }, + "resolutions": { + "moment": "2.18.1" } -} \ No newline at end of file +} diff --git a/packages/shared/src/index.js b/packages/shared/src/index.js index d3dd0840a..d41b01d38 100644 --- a/packages/shared/src/index.js +++ b/packages/shared/src/index.js @@ -35,7 +35,7 @@ export { default as Form } from './utils/Form'; export { default as Hooks } from './utils/Hooks'; export { default as IIIF } from './utils/IIIF'; export { default as Map } from './utils/Map'; -export { default as Object } from './utils/Object'; +export { default as ObjectJs } from './utils/Object'; export { default as String } from './utils/String'; export { default as Timer } from './utils/Timer'; diff --git a/packages/shared/vite.config.js b/packages/shared/vite.config.js new file mode 100644 index 000000000..a802f82b7 --- /dev/null +++ b/packages/shared/vite.config.js @@ -0,0 +1,49 @@ +// @flow + +import { flowPlugin, esbuildFlowPlugin } from '@bunchtogether/vite-plugin-flow'; +import react from '@vitejs/plugin-react'; +import { defineConfig } from 'vite'; +import * as packageJson from './package.json'; + +export default defineConfig(() => ({ + esbuild: { + include: /\.js$/, + exclude: [], + loader: 'jsx', + }, + optimizeDeps: { + esbuildOptions: { + plugins: [esbuildFlowPlugin()] + } + }, + plugins: [ + react(), + flowPlugin() + ], + build: { + sourcemap: true, + lib: { + entry: './src/index.js', + formats: ['es', 'cjs'], + fileName: (format) => `index.${format}.js` + }, + rollupOptions: { + external: [ + ...Object.keys(packageJson.peerDependencies) + ], + output: { + preserveModules: true + } + } + }, + resolve: { + preserveSymlinks: true, + mainFields: [ + 'browser', + 'module', + 'main', + 'jsnext:main', + 'jsnext' + ] + } +})); diff --git a/packages/shared/webpack.config.js b/packages/shared/webpack.config.js deleted file mode 100644 index abc26179a..000000000 --- a/packages/shared/webpack.config.js +++ /dev/null @@ -1,13 +0,0 @@ -const { configure } = require('@performant-software/webpack-config'); -const path = require('path'); - -module.exports = configure(__dirname, { - resolve: { - alias: { - './react-quill/dist/quill.snow.css$': path.resolve( - __dirname, - '../../node_modules/react-quill/dist/quill.snow.css' - ) - } - } -}); diff --git a/packages/storybook/.storybook/preview.js b/packages/storybook/.storybook/preview.js index 2b3b83529..3b9f2cb69 100644 --- a/packages/storybook/.storybook/preview.js +++ b/packages/storybook/.storybook/preview.js @@ -7,9 +7,8 @@ import '@peripleo/maplibre/peripleo-maplibre.css'; import '@peripleo/peripleo/default-theme'; import '../../core-data/dist/style.css'; import '../../geospatial/dist/style.css'; -import '../../semantic-ui/build/main.css'; -import '../../semantic-ui/build/semantic-ui.css'; -import '../../shared/build/main.css'; +import '../../semantic-ui/dist/style.css'; +import '../../shared/dist/style.css'; /** * If a list of accessibility tags are provided, only run the tests for those specific tags. diff --git a/packages/storybook/package.json b/packages/storybook/package.json index 9501fa87d..fcd21b27d 100644 --- a/packages/storybook/package.json +++ b/packages/storybook/package.json @@ -37,15 +37,20 @@ "dotenv": "^16.0.3", "http-proxy-middleware": "^2.0.6", "i18next": "^22.0.1", - "moment": "^2.29.2", + "moment": "^2.18.1", "react": "^18.2.0", "react-calendar": "^3.7.0", "react-docgen": "^6.0.1", + "react-dnd": "^11.1.3", + "react-dnd-html5-backend": "^11.1.3", "react-dom": "^18.2.0", "semantic-ui-react": "^2.1.2", "simple-keyboard-layouts": "^3.1.87", "storybook": "^7.0.26", "underscore": "^1.13.2", "vite": "^5.1.4" + }, + "resolutions": { + "moment": "2.18.1" } } diff --git a/packages/user-defined-fields/index.js b/packages/user-defined-fields/index.js deleted file mode 100644 index e588b9ce8..000000000 --- a/packages/user-defined-fields/index.js +++ /dev/null @@ -1 +0,0 @@ -module.exports = require('./build/index'); diff --git a/packages/user-defined-fields/package.json b/packages/user-defined-fields/package.json index 749430fd3..997c1e008 100644 --- a/packages/user-defined-fields/package.json +++ b/packages/user-defined-fields/package.json @@ -3,10 +3,19 @@ "version": "1.2.0-beta.29", "description": "A package of components used for allowing end users to define fields on models. Use with the \"user_defined_fields\" gem.", "license": "MIT", - "main": "./build/index.js", - "style": "./build/main.css", + "main": "./dist/index.cjs.js", + "module": "./dist/index.es.js", + "style": "./dist/style.css", + "type": "module", + "exports": { + ".": { + "import": "./dist/index.es.js", + "require": "./dist/index.cjs.js" + }, + "./style.css": "./dist/style.css" + }, "scripts": { - "build": "webpack --mode production && flow-copy-source -v src types" + "build": "vite build && flow-copy-source -v src types" }, "dependencies": { "@performant-software/semantic-components": "^1.2.0-beta.29", @@ -20,8 +29,11 @@ "react-dom": ">= 16.13.1 < 19.0.0" }, "devDependencies": { + "@bunchtogether/vite-plugin-flow": "^1.0.2", "@performant-software/webpack-config": "^1.0.0", + "@vitejs/plugin-react": "^4.2.1", "react": "^18.2.0", - "react-dom": "^18.2.0" + "react-dom": "^18.2.0", + "vite": "^5.1.4" } -} \ No newline at end of file +} diff --git a/packages/user-defined-fields/vite.config.js b/packages/user-defined-fields/vite.config.js new file mode 100644 index 000000000..e205fa565 --- /dev/null +++ b/packages/user-defined-fields/vite.config.js @@ -0,0 +1,39 @@ +// @flow + +import { flowPlugin, esbuildFlowPlugin } from '@bunchtogether/vite-plugin-flow'; +import react from '@vitejs/plugin-react'; +import { defineConfig } from 'vite'; +import * as packageJson from './package.json'; + +export default defineConfig(() => ({ + esbuild: { + include: /\.js$/, + exclude: [], + loader: 'jsx', + }, + optimizeDeps: { + esbuildOptions: { + plugins: [esbuildFlowPlugin()] + } + }, + plugins: [ + react(), + flowPlugin() + ], + build: { + sourcemap: true, + lib: { + entry: './src/index.js', + formats: ['es', 'cjs'], + fileName: (format) => `index.${format}.js` + }, + rollupOptions: { + external: [ + ...Object.keys(packageJson.peerDependencies) + ], + output: { + preserveModules: true + } + } + } +})); diff --git a/packages/user-defined-fields/webpack.config.js b/packages/user-defined-fields/webpack.config.js deleted file mode 100644 index 13da0a79a..000000000 --- a/packages/user-defined-fields/webpack.config.js +++ /dev/null @@ -1,3 +0,0 @@ -const { configure } = require('@performant-software/webpack-config'); - -module.exports = configure(__dirname); diff --git a/yarn.lock b/yarn.lock index bbd3a1c3f..527056cd6 100644 --- a/yarn.lock +++ b/yarn.lock @@ -11312,7 +11312,12 @@ moment-islamic-civil@ACGC/moment-islamic-civil: chai "^1.8.1" moment "^2.18.1" -moment@^2.18.1, moment@^2.29.2, moment@^2.30.1: +moment@2.18.1: + version "2.18.1" + resolved "https://registry.yarnpkg.com/moment/-/moment-2.18.1.tgz#c36193dd3ce1c2eed2adb7c802dbbc77a81b1c0f" + integrity sha512-QGcnVKRSEhbWy2i0pqFhjWMCczL/YU5ICMB3maUavFcyUqBszRnzsswvOaGOqSfWZ/R+dMnb9gGBuRT4LMTdVQ== + +moment@^2.18.1: version "2.30.1" resolved "https://registry.yarnpkg.com/moment/-/moment-2.30.1.tgz#f8c91c07b7a786e30c59926df530b4eac96974ae" integrity sha512-uEmtNhbDOrWPFS+hdjFCBfy9f2YoyzRpwcl+DqpC6taX21FzsTLQVbMV/W7PzNSX6x/bhC1zA3c2UQ5NzH6how==