move to vite

closes #971
3 years ago · 1715c2bb01
parent 4cda6579a7
commit 1715c2bb01
13 changed files with 5632 additions and 11890 deletions
--- a/.eslintignore
+++ b/.eslintignore
@ -1,2 +1,2 @@
 /dist
-/build
+/vite-dist
--- a/.gitignore
+++ b/.gitignore
@ -1,12 +1,5 @@
 node_modules
 .DS_Store
-dist
-build
-icon-build
-build-resources
-doc
-/ffmpeg
-/app.log
 *.provisionprofile

 .pnp.*
@ -16,3 +9,11 @@ doc
 !.yarn/releases
 !.yarn/sdks
 !.yarn/versions
+
+/dist
+/vite-dist
+/icon-build
+/build-resources
+/doc
+/ffmpeg
+/app.log
--- a/public/index.html
+++ b/public/index.html
@ -6,5 +6,6 @@
  </head>
  <body>
    <div id="root"></div>
+    <script type="module" src="/src/index.jsx"></script>
  </body>
 </html>
--- a/package.json
+++ b/package.json
@ -8,16 +8,15 @@
  "homepage": "./",
  "scripts": {
    "start": "concurrently -k \"npm run start:frontend\" \"npm run start:electron\"",
-    "start:frontend": "cross-env BROWSER=none PORT=3001 DISABLE_ESLINT_PLUGIN=true react-scripts start",
-    "start:electron": "wait-on http://localhost:3001 && electron .",
+    "start:frontend": "cross-env vite --port 3001",
+    "start:electron": "wait-on tcp:3001 && electron .",
    "icon-gen": "mkdirp icon-build build-resources/appx && node script/icon-gen.mjs",
    "download-ffmpeg-darwin-x64": "mkdirp ffmpeg/darwin-x64 && cd ffmpeg/darwin-x64 && wget https://github.com/mifi/ffmpeg-build-script/releases/download/5.1.2/ffmpeg -O ffmpeg && wget https://github.com/mifi/ffmpeg-build-script/releases/download/5.1.2/ffprobe -O ffprobe && chmod +x ffmpeg && chmod +x ffprobe",
    "download-ffmpeg-darwin-arm64": "mkdirp ffmpeg/darwin-arm64 && cd ffmpeg/darwin-arm64 && wget https://github.com/mifi/ffmpeg-builds/releases/download/5.1.2/ffmpeg-darwin-arm64-v5.1.2 -O ffmpeg && wget https://github.com/mifi/ffmpeg-builds/releases/download/5.1.2/ffprobe-darwin-arm64-v5.1.2 -O ffprobe && chmod +x ffmpeg && chmod +x ffprobe",
    "download-ffmpeg-linux-x64": "mkdirp ffmpeg/linux-x64 && cd ffmpeg/linux-x64 && wget https://github.com/mifi/ffmpeg-builds/releases/download/5.1.2/linux-x64-v5.1.1.tar.xz -O ffmpeg-ffprobe.xz && tar -xv --strip-components=1 -f ffmpeg-ffprobe.xz ffmpeg-5.1.1-amd64-static/ffmpeg ffmpeg-5.1.1-amd64-static/ffprobe",
    "download-ffmpeg-win32-x64": "mkdirp ffmpeg/win32-x64 && cd ffmpeg/win32-x64 && npx download-cli https://github.com/mifi/ffmpeg-builds/releases/download/5.1.2/win32-x64-v5.1.2.7z --out . --filename ffmpeg-ffprobe.7z && 7z x ffmpeg-ffprobe.7z && npx shx mv ffmpeg-5.1.2-essentials_build/bin/ffmpeg.exe ./ && npx shx mv ffmpeg-5.1.2-essentials_build/bin/ffprobe.exe ./",
-    "build": "yarn icon-gen && react-scripts build",
-    "test": "react-scripts test",
-    "eject": "react-scripts eject",
+    "build": "yarn icon-gen && vite build --outDir vite-dist",
+    "test": "NODE_OPTIONS=--experimental-vm-modules jest",
    "lint": "eslint --ext .jsx --ext .js . --ext .mjs",
    "pack-mac": "electron-builder --mac -m dmg",
    "prepack-mac": "yarn build",
@ -45,6 +44,7 @@
  "devDependencies": {
    "@types/jest": "^26.0.20",
    "@types/sortablejs": "^1.15.0",
+    "@vitejs/plugin-react": "^3.1.0",
    "color": "^3.1.0",
    "concurrently": "^6.0.0",
    "cross-env": "^7.0.3",
@ -65,11 +65,12 @@
    "framer-motion": "^9.0.3",
    "i18next-scanner": "^4.1.0",
    "icon-gen": "^3.0.0",
+    "jest": "^29.4.3",
    "ky": "^0.33.1",
    "mkdirp": "^1.0.3",
    "moment": "^2.29.4",
    "mousetrap": "^1.6.5",
-    "p-map": "^4.0.0",
+    "p-map": "^5.5.0",
    "patch-package": "^6.2.1",
    "pify": "^5.0.0",
    "pretty-bytes": "^6.0.0",
@ -78,7 +79,6 @@
    "react-i18next": "^11.3.3",
    "react-icons": "^4.1.0",
    "react-lottie-player": "^1.5.0",
-    "react-scripts": "^5.0.1",
    "react-sortablejs": "^6.1.4",
    "react-syntax-highlighter": "^15.4.3",
    "react-use": "^17.4.0",
@ -91,7 +91,8 @@
    "use-debounce": "^5.1.0",
    "use-trace-update": "^1.3.0",
    "uuid": "^8.3.2",
-    "wait-on": "^5.3.0"
+    "vite": "^4.1.1",
+    "wait-on": "^7.0.1"
  },
  "dependencies": {
    "@electron/remote": "^2.0.9",
@ -119,20 +120,26 @@
  "eslintConfig": {
    "extends": "react-app"
  },
-  "browserslist": {
-    "production": [
-      "electron 17.0"
+  "jest": {
+    "extensionsToTreatAsEsm": [
+      ".js",
+      ".mjs"
    ],
-    "development": [
-      "electron 17.0"
+    "testEnvironment": "node",
+    "testMatch": [
+      "**/__tests__/**/*.?([mc])[jt]s?(x)",
+      "**/?(*.)+(spec|test).?([mc])[jt]s?(x)"
    ]
  },
  "build": {
    "directories": {
      "buildResources": "build-resources"
    },
+    "extraMetadata": {
+      "main": "vite-dist/electron.js"
+    },
    "files": [
-      "build/**/*"
+      "vite-dist/**/*"
    ],
    "asar": {
      "smartUnpack": false
--- a/public/electron.js
+++ b/public/electron.js
@ -87,7 +87,7 @@ function createWindow() {

  if (isDev) mainWindow.loadURL('http://localhost:3001');
  // Need to useloadFile for special characters https://github.com/mifi/lossless-cut/issues/40
-  else mainWindow.loadFile('build/index.html');
+  else mainWindow.loadFile('vite-dist/index.html');

  // Open the DevTools.
  // mainWindow.webContents.openDevTools()
--- a/src/snapshots/edlFormats.test.js.snap
+++ b/src/snapshots/edlFormats.test.js.snap
--- a/src/snapshots/segments.test.js.snap
+++ b/src/snapshots/segments.test.js.snap
@ -1,35 +1,35 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP

 exports[`converts segments to chapters with gaps 1`] = `
-Array [
-  Object {
+[
+  {
    "end": 104.612,
    "start": 0,
  },
-  Object {
+  {
    "end": 189.053,
    "name": "label 1",
    "start": 104.612,
  },
-  Object {
+  {
    "end": 300.448,
    "start": 189.053,
  },
-  Object {
+  {
    "end": 476.194,
    "name": "label 2",
    "start": 300.448,
  },
-  Object {
+  {
    "end": 567.075,
    "start": 476.194,
  },
-  Object {
+  {
    "end": 704.264,
    "name": "label 3",
    "start": 567.075,
  },
-  Object {
+  {
    "end": 855.455,
    "name": "label 4",
    "start": 704.264,
@ -38,13 +38,13 @@ Array [
 `;

 exports[`converts segments to chapters with no gaps 1`] = `
-Array [
-  Object {
+[
+  {
    "end": 2,
    "name": "label 1",
    "start": 0,
  },
-  Object {
+  {
    "end": 3,
    "name": "label 2",
    "start": 2,
@ -53,8 +53,8 @@ Array [
 `;

 exports[`converts segments to chapters with single long segment 1`] = `
-Array [
-  Object {
+[
+  {
    "end": 1,
    "name": "label 1",
    "start": 0,
--- a/src/components/Working.jsx
+++ b/src/components/Working.jsx
@ -1,6 +1,6 @@
 import React, { memo } from 'react';
 import { motion } from 'framer-motion';
-import Lottie from 'react-lottie-player';
+import Lottie from 'react-lottie-player/dist/LottiePlayerLight';
 import { Button } from 'evergreen-ui';
 import { Trans } from 'react-i18next';

--- a/src/edlFormats.test.js
+++ b/src/edlFormats.test.js
@ -1,8 +1,12 @@
 import fs from 'fs/promises';
-import { join } from 'path';
+import { join, dirname } from 'path';
+import { fileURLToPath } from 'url';

 import { parseYouTube, formatYouTube, parseMplayerEdl, parseXmeml, parseFcpXml, parseCsv, getTimeFromFrameNum, formatCsvFrames, getFrameCountRaw, parsePbf } from './edlFormats';

+// eslint-disable-next-line no-underscore-dangle
+const __dirname = dirname(fileURLToPath(import.meta.url));
+
 const readFixture = async (name, encoding = 'utf-8') => fs.readFile(join(__dirname, 'fixtures', name), encoding);

 const expectYouTube1 = [
--- a/src/hooks/normalizeWheel.js
+++ b/src/hooks/normalizeWheel.js
@ -120,7 +120,7 @@ var PAGE_HEIGHT = 800;
 *         Firefox v4/Win7  |     undefined    |       3
 *
 */
-function normalizeWheel(/*object*/ event) /*object*/ {
+export default function normalizeWheel(/*object*/ event) /*object*/ {
  var sX = 0, sY = 0,       // spinX, spinY
      pX = 0, pY = 0;       // pixelX, pixelY

@ -161,5 +161,3 @@ function normalizeWheel(/*object*/ event) /*object*/ {
           pixelX : pX,
           pixelY : pY };
 }
-
-module.exports = normalizeWheel;
--- a/src/index.jsx
+++ b/src/index.jsx
@ -2,6 +2,8 @@ import React, { Suspense } from 'react';
 import { createRoot } from 'react-dom/client';
 import { MotionConfig } from 'framer-motion';

+import 'sweetalert2/dist/sweetalert2.css';
+
 import App from './App';
 import ErrorBoundary from './ErrorBoundary';
 import './i18n';
--- a/vite.config.js
+++ b/vite.config.js
@ -0,0 +1,12 @@
+import { defineConfig } from 'vite';
+import react from '@vitejs/plugin-react';
+
+
+// https://vitejs.dev/config/
+export default defineConfig({
+  plugins: [react()],
+  base: '',
+  build: {
+    chunkSizeWarningLimit: 3e6,
+  },
+});
--- a/yarn.lock
+++ b/yarn.lock