Migrate to Vite

.eslintrc

@@ -0,0 +1,18 @@
+{
+ "root": true,
+ "env": {
+ "browser": true,
+ "es2021": true,
+ "node": true
+ },
+ "extends": [
+ "plugin:vue/vue3-recommended",
+ "eslint:recommended",
+ "@vue/typescript/recommended"
+ ],
+ "parserOptions": {
+ "ecmaVersion": 2021
+ },
+ "plugins": [],
+ "rules": {}
+}

.gitignore

@@ -1,28 +1,27 @@
-.DS_Store
-node_modules
-/dist
-
-/tests/e2e/videos/
-/tests/e2e/screenshots/
-
-
-# local env files
-.env.local
-.env.*.local
-
-# Log files
+# Logs
+logs
+*.log
 npm-debug.log*
 yarn-debug.log*
 yarn-error.log*
 pnpm-debug.log*
+lerna-debug.log*
+
+node_modules
+dist
+dist-ssr
+*.local
 
 # Editor directories and files
+.vscode/*
+!.vscode/extensions.json
 .idea
-.vscode
+.DS_Store
 *.suo
 *.ntvs*
 *.njsproj
 *.sln
 *.sw?
 
-coverage
+# .env
+.env

.vscode/extensions.json

@@ -0,0 +1,3 @@
+{
+ "recommendations": ["Vue.volar", "Vue.vscode-typescript-vue-plugin"]
+}

docs/Setup.md

@@ -19,6 +19,6 @@ After registirng your app, follow [this instruction](https://firebase.google.com
 Go to [Google Cloud Concole](https://console.cloud.google.com/), and create a project. Then go to project top page and select **APIs & Services > Credentials** on the left sidebar. On the Credentials page, click **Create credentials > API key**. The new API key is listed on the **Credentials** page under **API keys**.
 
 ### STEP5. Host your website
-Click **New site from Git** button on your Netlify top page. Click Github icon and choose your project repository you forked. Build options will look like below. Click **Show advanced** button and **New variable** button will appear. Click **New variable** button and you can set API key and variables you created at STEP 3 and 4. Set variables like below. (Replace the values with yours. The last two key names are `VUE_APP_FIREBASE_MESSAGING_SENDER_ID` and `VUE_APP_FIREBASE_MEASUREMENT_ID`.) Click **Deploy site**. 
+Click **New site from Git** button on your Netlify top page. Click Github icon and choose your project repository you forked. Build options will look like below. Click **Show advanced** button and **New variable** button will appear. Click **New variable** button and you can set API key and variables you created at STEP 3 and 4. Set variables like below. (Replace the values with yours. The last two key names are `VITE_FIREBASE_MESSAGING_SENDER_ID` and `VITE_FIREBASE_MEASUREMENT_ID`.) Click **Deploy site**. 
 
 That's it! Your site domain will appear on the project page after the project has been deployed. Now you can play games as much as you want!

docs/SetupLocal.md

@@ -25,12 +25,12 @@ The files should look like this. (Replace the values with yours you created at S
 ```
 NODE_ENV=development
 BASE_URL=http:https://localhost:8080/
-VUE_APP_API_KEY=YOUR_GOOGLE_MAPS_API_KEY
-VUE_APP_FIREBASE_API_KEY=YOUR_FIREBASE_API_KEY
-VUE_APP_FIREBASE_PROJECT_ID=YOUR_FIREBASE_PROJECT_ID
-VUE_APP_FIREBASE_MESSAGING_SENDER_ID=YOUR_FIREBASE_MESSAGING_SENDER_ID
-VUE_APP_FIREBASE_APP_ID=YOUR_FIREBASE_APP_ID
-VUE_APP_FIREBASE_MEASUREMENT_ID=YOUR_FIREBASE_MEASUREMENT_ID
+VITE_API_KEY=YOUR_GOOGLE_MAPS_API_KEY
+VITE_FIREBASE_API_KEY=YOUR_FIREBASE_API_KEY
+VITE_FIREBASE_PROJECT_ID=YOUR_FIREBASE_PROJECT_ID
+VITE_FIREBASE_MESSAGING_SENDER_ID=YOUR_FIREBASE_MESSAGING_SENDER_ID
+VITE_FIREBASE_APP_ID=YOUR_FIREBASE_APP_ID
+VITE_FIREBASE_MEASUREMENT_ID=YOUR_FIREBASE_MEASUREMENT_ID
 ```
 
 `.env.production.local`

public/index.html → index.html

@@ -9,24 +9,24 @@
  <link
  rel="icon"
  type="image/x-icon"
- href="<%= BASE_URL %>images/favicon.ico"
+ href="<%= env.BASE_URL %>images/favicon.ico"
  />
  <link
  rel="icon"
  type="image/png"
  sizes="32x32"
- href="<%= BASE_URL %>images/favicon-32x32.png"
+ href="<%= env.BASE_URL %>images/favicon-32x32.png"
  />
  <link
  rel="icon"
  type="image/png"
  sizes="16x16"
- href="<%= BASE_URL %>images/favicon-16x16.png"
+ href="<%= env.BASE_URL %>images/favicon-16x16.png"
  />
  <link
  rel="apple-touch-icon"
  sizes="180x180"
- href="<%= BASE_URL %>images/apple-touch-icon.png"
+ href="<%= env.BASE_URL %>images/apple-touch-icon.png"
  />
  <link rel="preconnect" href="https://fonts.googleapis.com" />
  <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
@@ -41,15 +41,8 @@
  <title>Geoguess Master - Free geoguess game</title>
  </head>
  <body>
- <script src="https://maps.googleapis.com/maps/api/js?key=<%= VUE_APP_API_KEY %>"></script>
- <noscript>
- <strong
- >We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work
- properly without JavaScript enabled. Please enable it to
- continue.</strong
- >
- </noscript>
  <div id="app"></div>
- <!-- built files will be auto injected -->
+ <script type="module" src="/src/main.ts"></script>
+ <script src="https://maps.googleapis.com/maps/api/js?key=<%= env.VITE_API_KEY %>"></script>
  </body>
 </html>