- vite + markdown-it

src/components/sections/AboutSection.vue

@@ -1,3 +1,16 @@
+<script setup>
+import BaseButton from '@/components/buttons/BaseButton.vue'
+import { useRouter } from 'vue-router';
+
+const router = useRouter();
+
+function scrollTo(id) {
+  document.querySelector(id).scrollIntoView({
+    behavior: 'smooth'
+  })
+}
+</script>
+
 <template>
   <div class="bg-neutral-50">
     <div class="max-w-screen-xl mx-auto px-6 xl:px-2 py-11">
@@ -37,7 +50,7 @@
         <div id="grid-photo">
           <figure>
             <img
-              :src="`${publicPath}assets/me.jpg`"
+              src="/assets/me.jpg"
               class="mx-auto rounded-full object-cover w-[12.5rem] h-[12.5rem]"
               alt="Moje zdjęcie"
             >
@@ -48,20 +61,6 @@
   </div>
 </template>
 
-<script setup>
-import BaseButton from '@/components/buttons/BaseButton'
-import { useRouter } from 'vue-router'
-
-const router = useRouter()
-const publicPath = process.env.VUE_APP_BASE_URL + '/'
-
-function scrollTo(id) {
-  document.querySelector(id).scrollIntoView({
-    behavior: 'smooth'
-  })
-}
-</script>
-
 <style lang="scss">
 #grid-columns {
   grid-template-columns: 1fr 1fr .8fr;

src/components/sections/FavoriteProjects.vue

@@ -24,10 +24,11 @@
 <script setup>
 import { ref, onMounted } from 'vue'
 import { useRouter } from 'vue-router'
-import Projects from '@/components/SelectedProjects'
-import GhostButton from '@/components/buttons/GhostButton'
+import Projects from '@/components/SelectedProjects.vue'
+import GhostButton from '@/components/buttons/GhostButton.vue'
 
 const router = useRouter()
+const apiURL = import.meta.env.VITE_APP_API_URL
 
 let select_projects = ref([])
 
@@ -36,7 +37,7 @@ onMounted(() => {
 })
 
 function loadProjectList() {
-  fetch(process.env.VUE_APP_API_URL + '/projects?category=selected')
+  fetch(apiURL + '/projects?category=selected')
     .then(response => response.json())
     .then(data => {
       select_projects.value = data
@@ -44,7 +45,7 @@ function loadProjectList() {
 }
 </script>
 
-<style lang="scss" scoped>
+<style lang="scss">
 @import "scss/default";
 
 .selected-projects {

src/components/sections/contacts/MailContact.vue

@@ -103,7 +103,7 @@
 </template>
 
 <script setup>
-import BaseButton from '@/components/buttons/BaseButton'
+import BaseButton from '@/components/buttons/BaseButton.vue'
 import { ref, reactive, watch, computed } from 'vue'
 
 function emailValidate (mailObj) {