Updated Build Script and Change from webpack to vite

react-scheduler · Oct 11, 2024 · 546790e · 546790e
1 parent 391a4d6
commit 546790e
Show file tree

Hide file tree

Showing 8 changed files with 39 additions and 74 deletions.
diff --git a/.gitignore b/.gitignore
@@ -8,6 +8,7 @@ pnpm-debug.log*
 lerna-debug.log*
 
 node_modules
+dist
 dist-ssr
 *.local
 
@@ -21,6 +22,5 @@ dist-ssr
 *.njsproj
 *.sln
 *.sw?
-dist
 
 package-lock.json
diff --git a/src/index.html → index.html b/src/index.html → index.html
@@ -1,15 +1,16 @@
 <!DOCTYPE html>
 <html lang="en">
   <head>
-    <meta charset="utf-8" />
-    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
-    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
-    <meta name="description" content="" />
-    <meta name="author" content="Ansul Agrawal" />
-    <base href="/">
+    <meta charset="UTF-8" />
+    <link rel="icon" type="image/svg+xml" href="/banner.png" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>React Big Schedule</title>
+
+    <!-- Meta tag -->
+    <meta name="author" content="Ansul Agrawal" />
   </head>
   <body>
-    <div id="app"></div>
+    <div id="root"></div>
+    <script type="module" src="/src/examples/index.jsx"></script>
   </body>
 </html>
diff --git a/package.json b/package.json
@@ -39,6 +39,7 @@
     "README.md",
     "License"
   ],
+  "type": "module",
   "main": "dist/index.js",
   "homepage": "https://react-big-schedule.vercel.app",
   "repository": {
@@ -52,45 +53,42 @@
     "registry": "https://registry.npmjs.org/"
   },
   "scripts": {
-    "build": "node scripts/build.js",
-    "start": "webpack serve --mode development --config ./webpack/webpack.dev.config.js",
+    "start": "vite",
+    "build": "vite build",
+    "build-lib": "node scripts/build.cjs",
     "clean": "rimraf ./dist && mkdir dist",
-    "lint": "eslint ./src",
-    "fix": "eslint ./"
+    "lint": "eslint ./src"
   },
   "dependencies": {
     "@ant-design/icons": "^5.5.1",
-    "antd": "^5.21.2",
+    "@babel/cli": "^7.25.7",
+    "antd": "^5.21.3",
     "dayjs": "^1.11.13",
     "prop-types": "^15.8.1",
     "react": "^18.3.1",
     "react-dnd": "^14.0.5",
     "react-dnd-html5-backend": "^14.1.0",
     "react-dom": "^18.3.1",
-    "react-router-dom": "^6.26.2",
+    "react-router-dom": "^6.27.0",
     "rrule": "^2.8.1"
   },
   "devDependencies": {
-    "@babel/cli": "^7.25.7",
-    "@babel/core": "^7.25.7",
-    "@babel/eslint-parser": "^7.25.7",
-    "@babel/preset-env": "^7.25.7",
+    "@babel/core": "^7.25.8",
+    "@babel/preset-env": "^7.25.8",
     "@babel/preset-react": "^7.25.7",
-    "babel-loader": "^9.2.1",
-    "copy-webpack-plugin": "^12.0.2",
-    "css-loader": "^7.1.2",
+    "@eslint/js": "^9.11.1",
+    "@types/react": "^18.3.10",
+    "@types/react-dom": "^18.3.0",
+    "@vitejs/plugin-react": "^4.3.2",
+    "babel-plugin-transform-runtime": "^6.23.0",
     "eslint": "^8.2.0",
     "eslint-config-airbnb": "^19.0.4",
     "eslint-plugin-import": "^2.31.0",
     "eslint-plugin-jsx-a11y": "^6.10.0",
     "eslint-plugin-react": "^7.37.1",
     "eslint-plugin-react-hooks": "^4.6.2",
-    "eslint-webpack-plugin": "^4.2.0",
     "fs-extra": "^11.2.0",
-    "html-webpack-plugin": "^5.6.0",
-    "style-loader": "^4.0.0",
-    "webpack": "^5.95.0",
-    "webpack-cli": "^5.1.4",
-    "webpack-dev-server": "^5.1.0"
+    "globals": "^15.9.0",
+    "vite": "^5.4.8"
   }
 }
diff --git a/scripts/build.js → scripts/build.cjs b/scripts/build.js → scripts/build.cjs
diff --git a/src/examples/components/Header.jsx b/src/examples/components/Header.jsx
@@ -3,17 +3,20 @@ import { Col, Row } from 'antd';
 import React from 'react';
 import { Link } from 'react-router-dom';
 
+import logo from '/logo.png';
+import npm from '/npm.svg';
+
 function Header() {
   return (
     <Row align="middle" justify="space-between" className="header-wrapper">
       <Col span={2}>
         <Link to="/">
-          <img src="/logo.png" alt="Logo" className="logo_img" />
+          <img src={logo} alt="Logo" className="logo_img" />
         </Link>
       </Col>
       <Col>
         <Link to="https://www.npmjs.com/package/react-big-schedule" target="_blank" className="npm-icon">
-          <img src="/npm.svg" alt="npm-logo" />
+          <img src={npm} alt="npm-logo" />
         </Link>
         <Link to="https://github.com/react-scheduler/react-big-schedule" target="_blank" className="github-icon">
           <GithubOutlined />

diff --git a/src/examples/index.jsx b/src/examples/index.jsx
@@ -1,5 +1,4 @@
 import React from 'react';
 import { createRoot } from 'react-dom/client';
 import App from './app';
-
-createRoot(document.getElementById('app')).render(<App />);
+createRoot(document.getElementById('root')).render(<App />);
diff --git a/vite.config.js b/vite.config.js
@@ -0,0 +1,7 @@
+import { defineConfig } from 'vite'
+import react from '@vitejs/plugin-react'
+
+// https://vitejs.dev/config/
+export default defineConfig({
+  plugins: [react()],
+})
diff --git a/webpack/webpack.dev.config.js b/webpack/webpack.dev.config.js