Merge pull request 'configuration typescript sur le front-end' (#1) from feature/front/typescript into main

Reviewed-on: #1

thanasoft-front/.env

@@ -0,0 +1 @@
+NODE_ENV=

thanasoft-front/package.json

@@ -16,7 +16,8 @@
   "scripts": {
     "serve": "vue-cli-service serve",
     "build": "vue-cli-service build",
-    "lint": "vue-cli-service lint"
+    "lint": "vue-cli-service lint",
+    "typecheck": "vue-tsc --noEmit"
   },
   "dependencies": {
     "@fortawesome/fontawesome-svg-core": "1.3.0",
@@ -53,9 +54,12 @@
     "vuex": "4.0.2"
   },
   "devDependencies": {
+    "@types/minimatch": "^6.0.0",
+    "@types/node": "^24.6.0",
     "@vue/cli-plugin-babel": "4.5.15",
     "@vue/cli-plugin-eslint": "4.5.15",
     "@vue/cli-plugin-router": "4.5.15",
+    "@vue/cli-plugin-typescript": "^4.5.15",
     "@vue/cli-service": "4.5.15",
     "@vue/compiler-sfc": "3.2.0",
     "@vue/eslint-config-prettier": "6.0.0",
@@ -65,6 +69,8 @@
     "eslint-plugin-vue": "7.0.0",
     "prettier": "2.2.1",
     "sass": "1.43.3",
-    "sass-loader": "10.1.1"
+    "sass-loader": "10.1.1",
+    "typescript": "^5.9.2",
+    "vue-tsc": "^3.1.0"
   }
 }

thanasoft-front/src/router/index.js

@@ -333,7 +333,8 @@ const routes = [
 ];
 
 const router = createRouter({
-  history: createWebHistory(process.env.BASE_URL),
+  // Use root base so the app works whether served at / or via /build/index.html
+  history: createWebHistory("/"),
   routes,
   linkActiveClass: "active",
 });

thanasoft-front/src/shims-vue.d.ts

@@ -0,0 +1,35 @@
+declare module "*.vue" {
+  import type { DefineComponent } from "vue";
+  const component: DefineComponent<{}, {}, any>;
+  export default component;
+}
+
+declare module "*.png" {
+  const src: string;
+  export default src;
+}
+
+declare module "*.jpg" {
+  const src: string;
+  export default src;
+}
+
+declare module "*.jpeg" {
+  const src: string;
+  export default src;
+}
+
+declare module "*.gif" {
+  const src: string;
+  export default src;
+}
+
+declare module "*.webp" {
+  const src: string;
+  export default src;
+}
+
+declare module "*.svg" {
+  const src: string;
+  export default src;
+}

thanasoft-front/src/views/Home.vue

@@ -2,13 +2,6 @@
   <default-dashboard />
 </template>
 
-<script>
+<script setup lang="ts">
 import DefaultDashboard from "@/views/dashboards/Default.vue";
-
-export default {
-  name: "Home",
-  components: {
-    DefaultDashboard,
-  },
-};
 </script>

thanasoft-front/src/views/dashboards/Default.vue

@@ -203,7 +203,7 @@
     </div>
   </div>
 </template>
-<script>
+<script setupe lang="ts">
 import MiniStatisticsCard from "../../examples/Cards/MiniStatisticsCard.vue";
 import ReportsBarChart from "../../examples/Charts/ReportsBarChart.vue";
 import GradientLineChart from "../../examples/Charts/GradientLineChart.vue";

thanasoft-front/tsconfig.json

@@ -0,0 +1,30 @@
+{
+  "compilerOptions": {
+    "target": "ES2018",
+    "module": "ESNext",
+    "moduleResolution": "Node",
+    "lib": ["ES2020", "DOM", "DOM.Iterable"],
+    "jsx": "preserve",
+    "allowJs": true,
+    "checkJs": false,
+    "noEmit": true,
+    "strict": false,
+    "skipLibCheck": true,
+    "esModuleInterop": true,
+    "forceConsistentCasingInFileNames": true,
+    "resolveJsonModule": true,
+    "isolatedModules": true,
+    "baseUrl": ".",
+    "paths": {
+      "@/*": ["src/*"]
+    },
+    "types": ["node"]
+  },
+  "include": [
+    "src/**/*.ts",
+    "src/**/*.tsx",
+    "src/**/*.vue",
+    "src/shims-vue.d.ts"
+  ],
+  "exclude": ["node_modules", "dist"]
+}

thanasoft-front/vue.config.js

@@ -7,6 +7,18 @@ module.exports = {
   // Le index.html généré
   indexPath: "index.html",
 
-  // Important : comme le build est servi depuis /build/
-  publicPath: "/build/",
+  // En prod on sert les assets depuis /build/, en dev on reste sur la racine
+  publicPath: process.env.NODE_ENV === "production" ? "/build/" : "/",
+
+  // Dev server config to work locally alongside Laravel backend
+  devServer: {
+    historyApiFallback: true,
+    // proxy API calls to Laravel (adjust if your API prefix differs)
+    proxy: {
+      "^/api": {
+        target: "http://127.0.0.1:8000",
+        changeOrigin: true,
+      },
+    },
+  },
 };