It could be a bit tricky to use v-model on a piece of state that belongs to Vuex. and you have used v-model on todo.text here: <input class=”edit” type=”text” v-model=”todo.text” v-todo-focus=”todo == editedTodo” @blur=”doneEdit(todo)” @keyup.enter=”doneEdit(todo)” @keyup.esc=”cancelEdit(todo)”> use :value to read value and v-on:input or v-on:change to execute a method that perform the mutation inside an … Read more
The content of assets folder will be process by webpack, if you use pre-processor for CSS like SASS, SCSS, or Stylus it will transform into generic CSS. Or maybe you put an image on that folder, it also will be optimized by webpack for production. And for static folder, it just a place where you … Read more
Add the following to your nuxt.config.js file under the build section. nuxt.config.js build: { babel:{ plugins: [ [‘@babel/plugin-proposal-private-methods’, { loose: true }] ] } }
I go for mixins like with plain vue.js. Only difference – for global mixins – I include them as a plugin, but first: Non global mixins I would create an extra folder for my mixins. For example in a /mixins/testMixin.js export default { methods: { aCommonMethod () {} } } Then import in a layout, … Read more
The reason why option #4 is not working is because you’re returning a function that never gets executed: function catchPlugin(outerFunction) { return function async innerFunction(args) { try { const data = await outerFunction(args); return { data } } catch (error) { return { error } } } } Usage: const execute = catchPlugin((args) => { … Read more
As shown in the docs, the above commands correspond to: nuxt build: Build your application with webpack and minify the JS & CSS (for production). nuxt generate: Build the application and generate every route as a HTML file (used for static hosting). The –spa flag doesn’t seem to be covered in the docs themselves, however … Read more
Source: Declaring language in HTML tag · Issue #388 · nuxt/nuxt.js head supports a htmlAttrs property. It will map each key:value of the object as attribute:value module.exports = { head: { htmlAttrs: { lang: ‘en’ } } } How to do this when using i18n: Setting the language attribute when using i18n and Nuxt?
UPDATED AUGUST 2021 The Window is not defined error results from nodejs server side scripts not recognising the window object which is native to browsers only. As of nuxt v2.4 you don’t need to add the process.client or process.browser object. Typically your nuxt plugin directory is structured as below: ~/plugins/myplugin.js import Vue from ‘vue’; // … Read more
There is no built-in way to solve this within VS Code. The recommended way to solve this is by making use of the Stylelint extension to handle your CSS linting (& SCSS and/or Less, etc.). It’s very powerful and likely will improve your stylesheets beyond removing these errors for you. You need to add the … Read more
yes you can use vuejs route objects like $route.name or $route.path $nuxt.$route.path return current path $nuxt.$route.name The name of the current route, if it has one. Route Object Properties A route object represents the state of the current active route. It contains parsed information of the current URL and the route records matched by the … Read more