CODEWITHSUNDEEP
vue.jsvuejs3quasar-framework
Pooya Panahandeh
Pooya Panahandeh

Reputation: 638

Components are not rendering in quasar project with no error

I created Vue 3, quasar project. everything worked fine till the moment I add new component. everything is rendering except the new component which I built and added it to the project. please help me with this problem if you can.

Here is my code: index page:


<template>
  <q-page class="flex flex-center">
    <!-- section one-->
    <SectionOne />

  </q-page>
</template>

<script>
import { defineComponent } from "vue";
import SectionOne from "components/MainPage/SectionOne.vue";

export default defineComponent({
  components: {
    SectionOne,
  },
  name: "IndexPage",
});
</script>

Component:

<template>
  <div class="q-pa-md q-gutter-md">
    <div class="row justify-between">
      <q-parallax src="https://cdn.quasar.dev/img/parallax2.jpg">
        <h1 class="text-white">Basic</h1>
      </q-parallax>
    </div>
  </div>
</template>

Upvotes: 2

Views: 1214

Answers (2)

Gss86
Gss86

Reputation: 95

You can also import from the root 'src' like this:

import SectionOne from "src/components/MainPage/SectionOne.vue";

Upvotes: 1

Alvaro
Alvaro

Reputation: 101

Not sure about your project structure, but try this (missing "./")

import SectionOne from "./components/MainPage/SectionOne.vue";

Upvotes: 1

Related Questions