vite.config.ts

vite.config.ts

/// <reference types="vite/client" />
/// <reference types="vitest" />

import { defineConfig, splitVendorChunkPlugin } from "vite";
import react from "@vitejs/plugin-react-swc";
import path from "path";

// https://vitejs.dev/config/
export default defineConfig({
  // Provide any plugins required for Vite to work and perform additional setup.
  plugins: [react(), splitVendorChunkPlugin()],

  // Development server configuration
  server: {
    // Don't open the browser automatically, sometimes the Vite server is too fast and boots up before the server and causes an OKTA error
    open: false,

    // Provide a static port number for the project to run on, originally set via the .env file but we have access to the configuration now.
    port: 3001,

    // React-scripts did this via the package.json, Vite does it via the server proxy object
    proxy: {
      // Any incoming requests which start with /api then proxy them to the provided  backend address
      "/api": "http://localhost:7001",

      // Any incoming requests to /config.js just forward them to the backend
      "/config.js": "http://localhost:7001",
    },
  },

  resolve: {
    // Alias configuration
    alias: {
      // Okta doesn't support es-build just yet, fallback to the Universal Module Definition
      "@okta/okta-auth-js": "@okta/okta-auth-js/dist/okta-auth-js.umd.js",

      // A list of alias's we can use to access certain modules/packages e.g. ~bootstrap accesses bootstrap from the node_modules
      "~bootstrap": path.resolve(__dirname, "node_modules/bootstrap"),
    },
  },

  test: {
    // By default Jest used globals (expect, it, describe etc) didn't require imports. However, Vitest offers lowlevel imports which are typesafe and far more explict
    globals: false,

    // When rendering React components use the jsdom environment https://github.com/jsdom/jsdom
    environment: "jsdom",

    // Tests which have been converted to Vitest...
    include: [
      "./src/components/Controls/PatientListControls/*.test.jsx",
      "./src/components/Loader/Loader.test.jsx",
      "./src/components/Okta/AuthRequiredModal/AuthRequiredModal.test.jsx",
      "./src/components/pages/PatientDetails/PatientDetailsActivityMarkerPopup/PatientDetailsActivityMarkerPopup.test.jsx",
      "./src/components/pages/PatientDetails/PatientDetailsGraphLinePopup/PatientDetailsGraphLinePopup.test.jsx",
      "./src/components/pages/PatientDetails/PatientDetailsGraphMarkerPopup/PatientDetailsGraphMarkerPopup.test.jsx",
      "./src/components/pages/PatientDetails/PatientDetailsTreatmentsMarkerPopup/PatientDetailsTreatmentsMarkerPopup.test.jsx",
      "./src/components/Paginator/Paginator.test.jsx",
      "./src/components/Panes/PatientDetailsPane/LesionCharacteristics/LesionCharacteristics.test.jsx",
      "./src/components/Panes/PatientDetailsPane/LesionCharacteristics/LesionCharacteristic/LesionCharacteristic.test.jsx",
      "./src/components/Panes/PatientDetailsPane/VisualAcuityControls/VisualAcuityControls.test.jsx",
      "./src/components/Panes/PatientDetailsPane/PatientDetailsPane.test.jsx",
      "./src/components/Panes/PatientListPane/FiltersInformation/FiltersInformation.test.jsx",
      "./src/components/Panes/shared/**/**/*.test.jsx",
      "./src/components/Select/Select.test.jsx",
      "./src/hooks/useDropdownOptions/useDropdownOptions.test.js",
      "./src/hooks/usePatientEvents/usePatientEvents.test.js",
      "./src/components/Panes/PatientDetailsPane/DiseaseActive/DiseaseActive.test.jsx",
      "./src/hooks/useAuthentication/useAuthentication.test.js",
      "./src/hooks/useResource/useResource.test.js",
      "./src/hooks/useUserProfile/useUserProfile.test.js",
      "./src/hooks/usePatientInformation/usePatientInformation.test.ts",
      "./src/hooks/usePatientEventsGraph/usePatientEventsGraph.test.jsx",
      "./src/components/Table/Cell/Cell.test.jsx",
      "./src/components/Table/Filtering/FilterActions/FilterActions.test.jsx",
      "./src/components/Table/Filtering/FilterIcon/FilterIcon.test.jsx",
      "./src/components/Table/Filtering/FilterPopup/FilterPopup.test.jsx",
      "./src/components/Table/Filtering/Filters/String/String.test.jsx",
      "./src/components/Table/Filtering/Filters/DateRange/DateRange.test.jsx",
      "./src/components/Table/Filtering/Filters/Dropdown/Dropdown.test.jsx",
      "./src/components/Table/Sorting/SortingIcon/SortingIcon.test.jsx",
      "./src/utils/url/buildPatientsQueryStringParameters/buildQueryStringParameters.test.js",
      "./src/utils/validateBrowserInformation/validateBrowserInformation.test.js",
      "./src/utils/PatientList/calculateResourcesPerPage/calculateResourcesPerPage.test.js",
      "./src/components/TopMenu/TopMenu.test.jsx",
    ],

    // Tests which aren't currently working with Vitest...
    exclude: [],

    // Don't watch the tests for changes, unless vast majority of developers want this ???
    watch: false,

    // For every time that is ran run the setupTests file (Extends any matchers, performs cleanup etc)
    setupFiles: ["./src/setupTests.js"],

    coverage: {
      reportsDirectory: "./coverage/client",
    },
  },

  // Build configuration
  build: {
    // By default this is dist, were updating it to use the react-scripts build folder
    outDir: "build",
  },
});