diff --git a/.env b/.env deleted file mode 100644 index 0c48d3cda..000000000 --- a/.env +++ /dev/null @@ -1,2 +0,0 @@ -PORT=3000 -CHOKIDAR_USEPOLLING=true diff --git a/.eslintrc.js b/.eslintrc.js index e08f0b57a..e9c55eec0 100644 --- a/.eslintrc.js +++ b/.eslintrc.js @@ -13,8 +13,6 @@ module.exports = { }, }, extends: [ - 'react-app', - 'react-app/jest', 'plugin:react/recommended', // Uses the recommended rules from @eslint-plugin-react 'plugin:prettier/recommended', // Enables eslint-plugin-prettier and eslint-config-prettier. This will display prettier errors as ESLint errors. Make sure this is always the last configuration in the extends array. ], diff --git a/.prettierignore b/.prettierignore index 849ddff3b..567609b12 100644 --- a/.prettierignore +++ b/.prettierignore @@ -1 +1 @@ -dist/ +build/ diff --git a/.prettierrc.js b/.prettierrc.js index 415ca0578..66f90b933 100644 --- a/.prettierrc.js +++ b/.prettierrc.js @@ -1,7 +1,7 @@ module.exports = { semi: false, - trailingComma: "all", + trailingComma: 'all', singleQuote: true, printWidth: 100, - tabWidth: 2 -}; \ No newline at end of file + tabWidth: 2, +} diff --git a/README.md b/README.md index 24a987dd0..896332553 100644 --- a/README.md +++ b/README.md @@ -116,7 +116,8 @@ Within the download you'll find the following directories and files, logically g ``` coreui-free-react-admin-template ├── public/ # static files -│ └── index.html # html template +│ ├── favicon.ico +│ └── manifest.json │ ├── src/ # project root │ ├── assets/ # images, icons, etc. @@ -126,12 +127,15 @@ coreui-free-react-admin-template │ ├── views/ # application views │ ├── _nav.js # sidebar navigation config │ ├── App.js -│ ├── ... │ ├── index.js │ ├── routes.js # routes config │ └── store.js # template state example │ -└── package.json +├── index.html # html template +├── ... +├── package.json +├── ... +└── vite.config.mjs # vite config ``` ## Documentation diff --git a/index.html b/index.html new file mode 100644 index 000000000..ceddb2461 --- /dev/null +++ b/index.html @@ -0,0 +1,29 @@ + + + + + + + + + + + CoreUI Free React.js Admin Template + + + + + +
+ + + + diff --git a/jest.config.js b/jest.config.js deleted file mode 100644 index abf16ab93..000000000 --- a/jest.config.js +++ /dev/null @@ -1,17 +0,0 @@ -/** - * Copyright (c) 2013-present, creativeLabs Lukasz Holeczek. - * - * This source code is licensed under the MIT license found in the - * LICENSE file in the root directory of this source tree. - */ - -'use strict' - -module.exports = { - collectCoverageFrom: [ - 'src/**/*.{js,jsx}', - '!**/*index.js', - '!src/serviceWorker.js', - '!src/polyfill.js', - ], -} diff --git a/jsconfig.json b/jsconfig.json deleted file mode 100644 index 63f923e44..000000000 --- a/jsconfig.json +++ /dev/null @@ -1,6 +0,0 @@ -{ - "compilerOptions": { - "baseUrl": "." - }, - "include": ["src"] -} \ No newline at end of file diff --git a/package.json b/package.json index 3b1991bf7..56a6e587a 100644 --- a/package.json +++ b/package.json @@ -13,13 +13,10 @@ "license": "MIT", "author": "The CoreUI Team (https://github.com/orgs/coreui/people)", "scripts": { - "build": "react-scripts build", - "eject": "react-scripts eject", + "build": "vite build", "lint": "eslint \"src/**/*.js\"", - "start": "react-scripts start", - "test": "react-scripts test", - "test:cov": "npm test -- --coverage --watchAll=false", - "test:debug": "react-scripts --inspect-brk test --runInBand" + "serve": "vite preview", + "start": "vite" }, "dependencies": { "@coreui/chartjs": "^4.0.0-rc.0", @@ -35,7 +32,6 @@ "core-js": "^3.36.0", "prop-types": "^15.8.1", "react": "^18.2.0", - "react-app-polyfill": "^3.0.0", "react-dom": "^18.2.0", "react-redux": "^9.1.0", "react-router-dom": "^6.22.3", @@ -43,19 +39,16 @@ "simplebar-react": "^3.2.4" }, "devDependencies": { - "@babel/plugin-proposal-private-property-in-object": "^7.21.11", - "@testing-library/jest-dom": "^6.4.2", - "@testing-library/react": "^14.2.1", - "@testing-library/user-event": "^14.5.2", + "@vitejs/plugin-react": "^4.2.1", + "autoprefixer": "^10.4.18", + "eslint": "^8.57.0", "eslint-config-prettier": "^9.1.0", "eslint-plugin-prettier": "^5.1.3", + "eslint-plugin-react": "^7.34.0", + "eslint-plugin-react-hooks": "^4.6.0", + "postcss": "^8.4.35", "prettier": "3.2.5", - "react-scripts": "5.0.1", "sass": "^1.71.1", - "web-vitals": "^3.5.2" - }, - "engines": { - "node": ">=10", - "npm": ">=6" + "vite": "^5.1.6" } } diff --git a/public/index.html b/public/index.html deleted file mode 100644 index eeb29ba81..000000000 --- a/public/index.html +++ /dev/null @@ -1,50 +0,0 @@ - - - - - - - - - - - CoreUI Free React.js Admin Template - - - - - - - -
- - - diff --git a/src/App.test.js b/src/App.test.js deleted file mode 100644 index 3a7a8cc56..000000000 --- a/src/App.test.js +++ /dev/null @@ -1,9 +0,0 @@ -import React from 'react' -import { render, screen } from '@testing-library/react' -import App from './App' - -test('renders learn react link', () => { - render() - const linkElement = screen.getByText(/learn react/i) - expect(linkElement).toBeInTheDocument() -}) diff --git a/src/index.js b/src/index.js index d19a3bcd3..11d6e8658 100644 --- a/src/index.js +++ b/src/index.js @@ -1,10 +1,9 @@ -import 'react-app-polyfill/stable' -import 'core-js' import React from 'react' import { createRoot } from 'react-dom/client' -import App from './App' -import reportWebVitals from './reportWebVitals' import { Provider } from 'react-redux' +import 'core-js' + +import App from './App' import store from './store' createRoot(document.getElementById('root')).render( @@ -12,8 +11,3 @@ createRoot(document.getElementById('root')).render( , ) - -// If you want to start measuring performance in your app, pass a function -// to log results (for example: reportWebVitals(console.log)) -// or send to an analytics endpoint. Learn more: https://bit.ly/CRA-vitals -reportWebVitals() diff --git a/src/reportWebVitals.js b/src/reportWebVitals.js deleted file mode 100644 index dc6ff0781..000000000 --- a/src/reportWebVitals.js +++ /dev/null @@ -1,13 +0,0 @@ -const reportWebVitals = (onPerfEntry) => { - if (onPerfEntry && onPerfEntry instanceof Function) { - import('web-vitals').then(({ getCLS, getFID, getFCP, getLCP, getTTFB }) => { - getCLS(onPerfEntry) - getFID(onPerfEntry) - getFCP(onPerfEntry) - getLCP(onPerfEntry) - getTTFB(onPerfEntry) - }) - } -} - -export default reportWebVitals diff --git a/src/setupTests.js b/src/setupTests.js deleted file mode 100644 index 52aaef1d2..000000000 --- a/src/setupTests.js +++ /dev/null @@ -1,5 +0,0 @@ -// jest-dom adds custom jest matchers for asserting on DOM nodes. -// allows you to do things like: -// expect(element).toHaveTextContent(/react/i) -// learn more: https://github.com/testing-library/jest-dom -import '@testing-library/jest-dom' diff --git a/vite.config.mjs b/vite.config.mjs new file mode 100644 index 000000000..ee16a3581 --- /dev/null +++ b/vite.config.mjs @@ -0,0 +1,57 @@ +import { defineConfig, loadEnv } from 'vite' +import react from '@vitejs/plugin-react' +import path from 'node:path' +import autoprefixer from 'autoprefixer' + +export default defineConfig(({ mode }) => { + // Load .env + const env = loadEnv(mode, process.cwd(), '') + process.env = { ...process.env, ...env } + + return { + base: './', + build: { + outDir: 'build', + }, + css: { + postcss: { + plugins: [ + autoprefixer({}), // add options if needed + ], + }, + }, + define: { + // vitejs does not support process.env so we have to redefine it + 'process.env': process.env, + }, + esbuild: { + loader: 'jsx', + include: /src\/.*\.jsx?$/, + exclude: [], + }, + optimizeDeps: { + force: true, + esbuildOptions: { + loader: { + '.js': 'jsx', + }, + }, + }, + plugins: [react()], + resolve: { + alias: [ + { + find: 'src/', + replacement: `${path.resolve(__dirname, 'src')}/`, + }, + ], + extensions: ['.mjs', '.js', '.ts', '.jsx', '.tsx', '.json', '.vue', '.scss'], + }, + server: { + port: 3000, + proxy: { + // https://vitejs.dev/config/server-options.html + }, + }, + } +})