Convert from vue-cli to vite

.gitignore

@@ -21,3 +21,4 @@ yarn-error.log*
 *.sw?
 
 commit.sh
+package-lock.json

README.md

@@ -25,6 +25,7 @@ If you like bright and fresh colors, you will love this Free Tailwind CSS Templa
 - (If you are on a linux based terminal) Simply run `npm run install:clean`
 - (If not) Run in terminal `npm install`
 - (If not) Run in terminal `npm run build:tailwind` (each time you add a new class, a class that does not exist in `src/assets/styles/tailwind.css`, you will need to run this command)
+- (If not) Run in terminal `npm run build`
 - (If not) Run in terminal `npm run serve`
 - Navigate to https://localhost:8080
 - Check more about [Tailwind CSS](https://tailwindcss.com/?ref=creativetim)
@@ -118,11 +119,12 @@ vue-notus
 ├── ISSUE_TEMPLATE.md
 ├── LICENSE.md
 ├── README.md
-├── babel.config.js
+├── vite.config.js
 ├── package.json
+├── index.html
 ├── public
 │   ├── favicon.ico
-│   └── index.html
+│   └── apple-icon.png
 ├── src
 │   ├── App.vue
 │   ├── assets

public/index.html → index.html

@@ -21,11 +21,11 @@
     <meta charset="utf-8" />
     <meta http-equiv="X-UA-Compatible" content="IE=edge" />
     <meta name="viewport" content="width=device-width,initial-scale=1.0" />
-    <link rel="shortcut icon" href="<%= BASE_URL %>favicon.ico" />
+    <link rel="shortcut icon" href="/favicon.ico" />
     <link
       rel="apple-touch-icon"
       sizes="76x76"
-      href="<%= BASE_URL %>apple-icon.png"
+      href="/apple-icon.png"
     />
     <script src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY"></script>
     <title>
@@ -40,6 +40,6 @@
       >
     </noscript>
     <div id="app"></div>
-    <!-- built files will be auto injected -->
   </body>
+  <script type="module" src="/src/main.js"></script>
 </html>

package.json

@@ -6,50 +6,41 @@
   "repository": "https://github.com/creativetimofficial/vue-notus",
   "license": "MIT",
   "scripts": {
-    "serve": "vue-cli-service serve",
-    "build": "vue-cli-service build && gulp licenses",
-    "lint": "vue-cli-service lint",
+    "serve": "vite preview",
+    "build": "vite build && gulp licenses",
     "build:tailwind": "tailwind build src/assets/styles/index.css -o src/assets/styles/tailwind.css",
-    "install:clean": "rm -rf node_modules/ && rm -rf package-lock.json && npm install && npm run build:tailwind && npm run serve"
+    "install:clean": "rm -rf node_modules/ && rm -rf package-lock.json && npm install && npm run build:tailwind && npm run build && npm run serve",
+    "dev": "vite"
   },
   "dependencies": {
-    "@fortawesome/fontawesome-free": "5.15.3",
-    "@popperjs/core": "2.9.1",
-    "@tailwindcss/forms": "0.2.1",
-    "@vue/compiler-sfc": "3.0.7",
+    "@fortawesome/fontawesome-free": "^5.15.4",
+    "@popperjs/core": "2.11.6",
+    "@tailwindcss/forms": "0.5.3",
     "chart.js": "2.9.4",
-    "core-js": "3.9.1",
-    "gulp": "4.0.2",
-    "gulp-append-prepend": "1.0.8",
-    "tailwindcss": "2.0.4",
-    "vue": "3.0.7",
-    "vue-router": "4.0.5"
+    "gulp": "^4.0.2",
+    "gulp-append-prepend": "1.0.9",
+    "tailwindcss": "^3.2.4",
+    "vue": "3.2.45",
+    "vue-router": "4.1.6"
   },
   "devDependencies": {
-    "@babel/core": "7.13.10",
-    "@babel/eslint-parser": "7.13.10",
-    "@vue/cli-plugin-babel": "5.0.0-alpha.7",
-    "@vue/cli-plugin-eslint": "5.0.0-alpha.7",
-    "@vue/cli-service": "5.0.0-alpha.7",
-    "autoprefixer": "10.2.5",
-    "eslint": "7.22.0",
-    "eslint-plugin-vue": "7.7.0",
-    "postcss": "8.2.8",
-    "vue-template-compiler": "2.6.12"
+    "@vitejs/plugin-vue": "^3.2.0",
+    "autoprefixer": "10.4.13",
+    "eslint": "^8.29.0",
+    "eslint-plugin-vue": "^8.7.1",
+    "postcss": "8.4.19",
+    "vite": "^3.2.4"
   },
   "eslintConfig": {
     "root": true,
     "env": {
-      "node": true
+      "es2021": true
     },
     "extends": [
       "plugin:vue/essential",
       "eslint:recommended"
     ],
-    "rules": {},
-    "parserOptions": {
-      "parser": "@babel/eslint-parser"
-    }
+    "rules": {}
   },
   "postcss": {
     "plugins": {

vite.config.js

@@ -0,0 +1,14 @@
+import { defineConfig } from 'vite'
+import vue from '@vitejs/plugin-vue'
+
+const path = require("path");
+
+// https://vitejs.dev/config/
+export default defineConfig({
+    plugins: [vue()],
+    resolve: {
+        alias: {
+            "@": path.resolve(__dirname, "./src"),
+        },
+    },
+})