Questions tagged [nuxt]
562 questions
0
votes
0
answer
5
Views
Nuxtjs /Vuex is not working with complex objects
I am receiving the following message when I try to change the value in my form, works for simple object though.
[vuex] do not mutate vuex store state outside mutation handlers.
I have a list and I need to update a register in this list, so pops up a dialogue modal populated and a need to change or n...
0
votes
0
answer
3
Views
how i can generate pages from library components from api?
In my project with nuxt.js need generate dynamic pages like items/_id from api. every page can use any of 9 components, sometimes this components can be more than 1 on page with various data/props.
dunno somethink like that
where keys parent object is order. type in children - what component, and o...
1
votes
2
answer
514
Views
Deploy Nuxt on shared hosting
I want to know if it is possible to deploy Nuxt app on a shared hosting.
After running npm run build --spa it generated below file structure in the dist directory, but don't know how to go from here.
nuxt dist
1
votes
1
answer
336
Views
Where is safest to store Json Web Tokens JWTs in client side?
Hello stackoverflow community!
We build an SPA app with nuxts.js framework and we arrived to the point which is the safest way to store a JWT token from our backend API service.
We have two options cookies with httpOnly flag versus localStorage. I read a ton of articles about the comparison of this...
1
votes
1
answer
1.1k
Views
potentially fixable with the `--fix` option
I am creating a app with nuxt.js but everytime I launch the app, gives me the error of eslint and saying 'potentially fixable with the --fix option.'
I did the command npm run lint -- --fix and it works but then If I do another change in any vue file it comes again the same error and I have to do it...
0
votes
0
answer
3
Views
Use workbox-background-sync in nuxt
I wonder how to use workbox-background-sync in nuxt.js.
I've tried this way as below:
use 'custom-sw.js', so change the 'swURL' value
// nuxt.config.js
workbox: {
swURL: 'custom-sw.js'
}
create custom-sw.js in the static folder
importScripts('https://cdn.jsdelivr.net/npm/[email protected]/workbox/wo...
0
votes
1
answer
15
Views
Cannot Set cookie in axios response
I'm using the Nuxt.js to develop the website, I want to call API and put the results to the cookie on server side
I will do this part in Nuxt.js middleware.
But I can call API, I can set the cookies, but I CANNOT set cookie using the API response.
Call API
import axios from 'axios'
export default ({...
1
votes
3
answer
2.4k
Views
How use own js as plugin using nuxt js
i am using nuxt js. i have a helper.js script inside plugins folder which have a simple Test() method. Now how i can use this Test() method from pages.
helper.js
export default function Test() {
return 'This is test'
}
1
votes
1
answer
1.9k
Views
Nuxt.js: Module Error (from ./node_modules/eslint-loader/index.js):
I installed Nuxt starter template the recommended way:
npx create-nuxt-app fffff
Once inside fffff I installed css-loder (npm install --save-dev css-loader) then I launched the server: npm run dev
I got this error message:
> [email protected] dev /home/begueradj/fffff
> nuxt
INFO Building project
✔ suc...
1
votes
2
answer
385
Views
Nuxt: displaying local image from static folder
I'm getting started with nuxt. My static folder is in the screenshot. I've been trying to follow https://nuxtjs.org/guide/assets/#static
I've got a vuetify carousel component that was working fine with urls as the src. Now I want to try to serve local static files. I tried:
export default {
data ()...
1
votes
2
answer
231
Views
Clearing Text Fields On button Click in Vue Js?
I have a layout on which i am looping to get text fields and a button. How do i add a function on the button so that it clears only it's respective fields.
Check out the fiddle here.
https://jsfiddle.net/pu4ht2gb/7/
Each text with it's own state and clear should clear the respective
text fields
Cle...
0
votes
0
answer
357
Views
cross domain with nuxtjs/axios
I want to call a api provided by another domain, follow the official document, this is part of the nuxt.config.js：
modules: ['@nuxtjs/axios'],
axios: {
proxy: true,
baseURL: 'http://localhost:8000/api',
// prefix: '/api', // it not work
credentials: true,
},
proxy: {
'/api/douban': {
target: 'http...
1
votes
0
answer
27
Views
not show custom error page when request failed
When i catch a error in nuxt/axios plugin, i call the error function provided in context to show error page, but except the 404 error, when the request failed with other status code(ex: 403), the request from node is always Status Code: 500 NuxtServerError, and the custom error page not show as expe...
1
votes
1
answer
1.3k
Views
Nuxt.js transition not working
LOGIC: i have one pages/account.vue containing two child components components/beforeLogin and components/afterLogin. child component include is done inside conditional blog in pages/account.vue through result which is string let say 'x' stored in localstorage and was stored by server.
QUESTION: why...
1
votes
0
answer
70
Views
AWS Failed to execute 'setRequestHeader' on 'XMLHttpRequest' with Evaporate.js
I'm using the Evaporate (https://github.com/TTLabs/EvaporateJS) to upload my files to S3. The app is in Vue/Nuxt.js setup, and this is my config:
const uploadApiConfig = {
signerUrl: '/api/sign_auth',
awsRegion: process.env.awsRegion,
aws_key: process.env.awsKey,
bucket: process.env.awsBucket,
compu...
1
votes
0
answer
616
Views
nuxt.js and bulma - how to customize css
Im new to both vue.js, nuxt.js and bulma and I'm trying to do simple customizing of style.
I've created a new nuxt.js project and add bulma using https://buefy.github.io/#/documentation/start where I'm trying to set a background image to the hero.
Here is my index.vue page:
Hero title
Hero subtitle...
1
votes
1
answer
778
Views
Can't get state stored by Vuex in ~/plugins/axios.js
I have problem to get token stored by Vuex in ~/plugins/axios.js. Hope your guys take a look for me please.
My Vuex: ~/store/index.js
export const state = () => ({
authUser: null,
token: null
})
export const mutations = {
SET_USER: function (state, user) {
state.authUser = user
},
SET_TOKEN: functio...
1
votes
0
answer
404
Views
When I publish vue component module, I got this error "export 'default' (imported as 'NuxtAutolink') was not found in 'nuxt_autolink'
I'm trying to publish my original .vue component module 'nuxt_autolink' for nuxt.js(and also Vue.js).
In my .vue file, I imported my module like below
import NuxtAutolink from 'nuxt_autolink';
export default {
components: {
NuxtAutolink,
},
};
but when I start ,
npm run dev
I got thie error
39:18...
1
votes
0
answer
823
Views
Vue + Nuxt - Different page transitions on button click
I am building a Vue app and started with NuxtJS. NuxtJS has an build-in page transition module so adding page transitions was easy, but now I want to display a different transition when I click a specific button.
So:
I'm on route '/test', and when I click on the Menu to '/posts', it has to fade, but...
1
votes
2
answer
1.1k
Views
Access nuxt.js env variable in feathers client plugin in production mode
I can't seem to access the process.env.baseUrl variable from the feathers client plugin. The variable returns an empty string. I can use the variable on server side. I can resolve it by hardcoding the url in env.baseUrl in nuxt.config.js, but I'd rather not. The weird thing is that it runs without a...
1
votes
0
answer
229
Views
Nuxt error app.listen().then is not a function
I am following this nuxt document link
https://nuxtjs.org/api/configuration-dev
When I run nuxt programmatically using npm run dev-https command on my windows machine I got the following error.
app.listen(...).then is not a function
The same code will work if I replace like this
app.listen(port, hos...
1
votes
1
answer
677
Views
The server responded with a status of 401 (Unauthorized) [Strapi]
I am trying to build an app with Nuxt.js (not modified at all) connect it to a Strapi api and I am completely new to this. I followed the tutorial on the Strapi blog to deploy the Strapi api to Heroku and the Nuxt.js app runs locally. Both instances run fine on their own.
But now I when I try a get...
1
votes
1
answer
898
Views
Deploy Nuxt.js to Google App Engine Return 502 Bad Gateway
Hi is there anyone who has tried to deploy nuxt app to Google App Engine. I have tried from nuxt regular and express template, it shows 502 Bad Gateway. I don't modify anything from create-nuxt-app command. My app.yaml file contains
runtime: nodejs
env: flex
Is there anything wrong with my setup or...
1
votes
0
answer
99
Views
nuxtjs route map in order
I have an issues with nuxtjs route naming.
Ex: my pages folder is
page:
-|blog:
-|_categorySlug.vue
-|_postSlug.html.vue
-|service:
-|index.vue
When i access url like
example.com/blog/demo-post-slug.html -> route map to /blog/_categorySlug.vue
example.com/blog/demo-category-slug -> route map to /bl...
1
votes
1
answer
132
Views
mkv video doesn't play in my nuxt project (webpage)
I am new to Vue.js / Nuxt / Webpack
The Problem: My web page displays a video. This works fine for normal formats like .mp4
but I have tried displaying a .mkv video, which produces the error:
Module parse failed: Unexpected character '->' (1:0) You may need an
appropriate loader to handle this fil...
1
votes
0
answer
292
Views
After Nuxt build api returns 404
I'm having this weird issue and I seriously need your help. In development my code works perfectly fine but after doing nuxt build and all the apis are returning 404 error. Please help
When I'm building the api and running it, it works. In development api and nuxt both works but building nuxt and th...
1
votes
1
answer
1.3k
Views
Getting data from store actions in nuxt.js
I'm trying to learn vue.js, nuxt, and how to use the store all at once. I'm slowly getting what to do, but I think the store is a bit more complicated then I expected.
So I'm trying to render a list of 'pages' from an array. Right now it's just an object from the code, but I'd like to later on repla...
1
votes
1
answer
479
Views
Nuxt.js and srcDir option: Rendering url favicon 404 error
After adding srcDir option in a nuxt.config.js file, I've moved pages, components and layouts folders to src directory. Here is my configuration:
module.exports = {
srcDir: 'src',
head: {
title: 'hello',
meta: [
{ charset: 'utf-8' },
{ name: 'viewport', content: 'width=device-width, initial-scale=1'...
1
votes
0
answer
930
Views
Server Side rendering in Nuxt Axios module proxy URL
I'm using Axios module officially provided by Nuxt.js here, https://github.com/nuxt-community/axios-module.
How can I call action 'SET_NEW_DEAL' from component in fetch method?
async fetch ({ store }) {
await store.dispatch('SET_NEW_DEAL',store.getters.newDeal.page);
}
Is this correct?
Mine Acions f...
1
votes
0
answer
56
Views
Ava Testing For Logged In Pages
hi i'm new to ava testing. I am able to test for pages that are shown to non logged in users. Now i would like to test for logged in users which means the pages will change accordingly. How do i test for such a scenario? My best guess is to use Phantomjs or nightmarejs with ava.
1
votes
0
answer
91
Views
Nuxt + IOT (aws-iot-device-sdk)
I create a plugin like this:
var awsIot = require('aws-iot-device-sdk')
var device = awsIot.device({
keyPath: 'xxxxxx,
certPath: 'xxxxxx,
caPath: 'xxxxxx',
clientId: 'xxxxx',
region: 'xxxxxx',
host: 'xxxxxxxxxx.amazonaws.com'
})
It works, but displays an error message:
C:\Sistemas\AM\nodemodules\aw...
1
votes
1
answer
1.1k
Views
Vuex, computed properties are not reactive
I trying to have a state shared between some components (sub-components) that where each sub-combonent (and parent component) can update the shared property (store in vueX state).
I have make a small 'How to reproduce' here:
Vue.component('urlQueryComponent', {
template: 'object: {{pathQuery}}',
com...
1
votes
1
answer
245
Views
Nuxt.js with Express on Heroku - SPA and logging not working
May I ask for the help of the community? My issue:
I have successfully deployed my Nuxt.js site to heroku but I am facing two things
My app does not behave like a SPA. Moving from one menu to another loads all the files all the times. (This works perfectly fine on localhost).
heroku logs gives me no...
1
votes
0
answer
39
Views
Cannot load a library on the client in a Nuxt app
https://github.com/mohrtw/NuxtLoadLibraryOnClient/tree/master
NuxtLoadLibraryOnClient
Problem:
Our imported library is not loading on the client.
How the app works:
pages/index.vue import SO from '../static/someObjects.js';
asyncData creates an SO.AnObject
components/util/objectLoader receives the S...
1
votes
0
answer
51
Views
How can I validate the dynamic part of vue-route, with nuxt?
I have two pages in my app with names:
1) album_id.vue
2) albums_id.vue
'id' parameter supposed to be a number. The route for first case should look like { name: '/album', params: {id: '123'}}, and for the second - { name: '/albums', params: {id: '123'}}
The issue is - when I reload the page, it tr...
1
votes
1
answer
347
Views
Nuxt config dynamic stylesheet
How would I go about loading a stylesheet dynamically (in Nuxt.js) based on a UI button being clicked.
For example, I have this in my nuxt.config.js:
let org = 'default';
module.exports = {
css: [
'~/assets/sass/' + org + '/index.scss',
]
};
I omitted some of the code from this block, but what you a...
1
votes
2
answer
47
Views
Vuejs: I need to reset the button back to the first name after pressing the button the third time
I have this vuejs code and I am trying to do loop effect with a button. I would like the button to go back to the first comment (that is in the Javascript) straight after clicking on the button for the third time. Below is my HTML and Javascript code. Many thanks is advance.
HTML:
>
Javascript:
exp...
1
votes
0
answer
147
Views
Routes transitions doesnt not work in nuxt.js + electron.js
I use vue.js + nuxt.js + electron
in global.css i adding next code
.page-enter-active, .page-leave-active{
transition: all 0,5s;
}
.page-enter, .page-leave-active{
opacity: 0;
transform: scale(0);
}
but transitions effects does not work
how to solve a problem?
1
votes
0
answer
218
Views
Nuxt does not load proper css in first load
I am using nuxtjs/vuetify and I used the command npm run generate and uploaded it to my server. In the first load, It doesn't show the right theme for my nuxt app.
After I reload again, it shows the proper color of my website.
1
votes
0
answer
224
Views
Vue - use Events, Event Bus, or Vuex for showing components
I'm currently building a larger scale vue application. For global state management I use vuex of course. However, I came across the question of how to show or hide really simple components. For example I have a navbar which can open up a bug form modal component. I also have a sidebar component whic...