Diamond with NUXT

Forum rules
Please note that response time for technical support is within 3-5 business days.
Post Reply
wellingtonc
Posts: 4
Joined: 16 Dec 2020, 02:25

16 Dec 2020, 12:43

Hello, I bought the diamond recently, and I have a doubt, in the guide you ask to copy everything that is in SRC to the folder of the same name within the project, but my project does not have this folder, it may be because I am using NUXT.
Where would I have to transfer this to?

wellingtonc
Posts: 4
Joined: 16 Dec 2020, 02:25

17 Dec 2020, 14:16

I talked about it on discord with some people on the team, and I think it would be interesting to have an installation tutorial for NUXT, as it is one of the biggest VUE frameworks.
Or a way to achieve a simpler installation.

tugce.kucukoglu
Posts: 560
Joined: 23 Oct 2020, 09:28

21 Dec 2020, 13:47

Hi,
Firstly you need to create a new Nuxt project.

Code: Select all

npm init nuxt-app <project-name>
After that

Code: Select all

npm i primevue@2.2.3 primeicons --save
and import them into the

Code: Select all

css
option in

Code: Select all

nuxt.config.js
Then create your first plugin

Code: Select all

primevue.js
into the plugins folder which is similar to

Code: Select all

main.js
as in the Vue project and import it from the

Code: Select all

nuxt.config.js
.

Copy all

Code: Select all

src/App*.vue
files to the

Code: Select all

components
folder of your Nuxt project and import

Code: Select all

App.vue
as a component to

Code: Select all

default.vue
file in the

Code: Select all

layouts
option.

Copy all

Code: Select all

public/assets
files to the

Code: Select all

assets
folder in Nuxt applicaiton and then build them

Code: Select all

sass --watch assets/:assets/
Unfortunately, Nuxt does not support Vue 3 related to this issue https://github.com/nuxt/nuxt.js/issues/5708. So as soon as possible we will make ready our Nuxt integration tutorial. Until then you can ask your questions on PrimeLand channel or forum.

Best Regards,

tugce.kucukoglu
Posts: 560
Joined: 23 Oct 2020, 09:28

21 Dec 2020, 19:49

plugins/primevue.js

Code: Select all

import Vue from 'vue';
import Button from 'primevue/button';

Vue.component('Button', Button);
overwritten nuxt.config.js

Code: Select all

export default {
  // Global page headers
  head: {
    title: 'diamond',
    meta: [
      { charset: 'utf-8' },
      { name: 'viewport', content: 'width=device-width, initial-scale=1' },
      { hid: 'description', name: 'description', content: '' }
    ],
    link: [
      { rel: 'icon', type: 'image/x-icon', href: '/favicon.ico' }
    ]
  },

  // Global CSS
  css: [
    { src: 'primevue/resources/primevue.min.css'},
    { src: 'primeicons/primeicons.css'},
    { src: 'primevue/resources/themes/saga-blue/theme.css'},
  ],

  // Plugins to run before rendering page
  plugins: [
    {src: '@/plugins/primevue.js', mode: 'client'}
  ],
}


Post Reply

Return to “Diamond - PrimeVue”

  • Information
  • Who is online

    Users browsing this forum: No registered users and 2 guests