Hi, do you have ideas how to pass configuration settings from AdonisJS to the Nuxt/Vue side?

When I'm trying this from Nuxt app:

const config = use('Config')

I'm getting:

ReferenceError: use is not defined

Fresh new clone, cannot run any scripts.

TypeError: this.nuxt.build is not a function at new NuxtController (/AdonuxtTest/app/Http/Controllers/NuxtController.js:14:17) at Object.<anonymous> (/AdonuxtTest/app/Http/Controllers/NuxtController.js:24:18) at Module._compile (module.js:570:32) at Object.Module._extensions..js (module.js:579:10) at Module.load (module.js:487:32) at tryModuleLoad (module.js:446:12) at Function.Module._load (module.js:438:3) at Module.require (module.js:497:17) at require (internal/module.js:20:19) at requireStack (/AdonuxtTest/node_modules/require-stack/src/index.js:44:12) at Object.Ioc._autoLoad (/AdonuxtTest/node_modules/adonis-fold/src/Ioc/index.js:178:18) at Ioc.use (/AdonuxtTest/node_modules/adonis-fold/src/Ioc/index.js:378:18) at /AdonuxtTest/server.js:19:3 at fold.Registrar.register.then (/AdonuxtTest/bootstrap/http.js:105:9) at process._tickCallback (internal/process/next_tick.js:109:7) at Module.runMain (module.js:606:11)

Hello, I am trying to use Vue-clip plugin in my Adonuxt project. (http://vueclip.adonisjs.com)

This is my nuxt.js configuration file:

...
build: {
vendor: ['axios', 'vue-clip']
},
plugins: [
{ src: '~plugins/vue-clip.js', ssr: false }
],
...

And this is my ~plugins/vue-clip.js file:

import Vue from 'vue'
import VueClip from 'vue-clip'
Vue.use(VueClip)

This is the error I have on render:

[Vue warn]: You are using the runtime-only build of Vue where the template compiler is not available. Either pre-compile the templates into render functions, or use the compiler-included build.

Do you know where it could come from ?

Getting this error on a specific page of my app.
Only happens when running in dev mode

What do it mean?

yarn dev v0.20.3
$ npm run watch && node ./ace nuxtbuild && node server.js  

> [email protected] watch /home/landan/www/adonuxt-rp
> nodemon --watch app --watch bootstrap --watch config --watch .env

[nodemon] 1.11.0
[nodemon] to restart at any time, enter `rs`
[nodemon] watching: /home/landan/www/adonuxt-rp/app/**/* /home/landan/www/adonuxt-rp/bootstrap/**/* /home/landan/www/adonuxt-rp/config/**/* .env
[nodemon] starting `node server.js`
info adonis:framework +0ms serving app on localhost:4000
webpack built 6c4e179a3673f9db62bf in 6127ms
client is authenticated!
webpack building...
webpack built 6c4e179a3673f9db62bf in 829ms
crypto.js:74
  this._handle.update(data, encoding);
               ^

TypeError: Data must be a string or a buffer
    at TypeError (native)
    at Hash.update (crypto.js:74:16)
    at HarmonyExportImportedSpecifierDependency.updateHash (/home/landan/www/adonuxt-rp/node_modules/webpack/lib/dependencies/HarmonyExportImportedSpecifierDependency.js:144:8)
    at /home/landan/www/adonuxt-rp/node_modules/webpack/lib/DependenciesBlock.js:33:5
    at Array.forEach (native)
    at NormalModule.DependenciesBlock.updateHash (/home/landan/www/adonuxt-rp/node_modules/webpack/lib/DependenciesBlock.js:32:20)
    at NormalModule.Module.updateHash (/home/landan/www/adonuxt-rp/node_modules/webpack/lib/Module.js:162:41)
    at NormalModule.updateHash (/home/landan/www/adonuxt-rp/node_modules/webpack/lib/NormalModule.js:327:30)
    at modules.forEach.m (/home/landan/www/adonuxt-rp/node_modules/webpack/lib/Chunk.js:253:31)
    at Array.forEach (native)
    at Chunk.updateHash (/home/landan/www/adonuxt-rp/node_modules/webpack/lib/Chunk.js:253:16)
    at Compilation.createHash (/home/landan/www/adonuxt-rp/node_modules/webpack/lib/Compilation.js:1121:10)
    at sealPart2 (/home/landan/www/adonuxt-rp/node_modules/webpack/lib/Compilation.js:605:9)
    at Compilation.applyPluginsAsyncSeries (/home/landan/www/adonuxt-rp/node_modules/tapable/lib/Tapable.js:131:46)
    at Compilation.seal (/home/landan/www/adonuxt-rp/node_modules/webpack/lib/Compilation.js:570:8)
    at /home/landan/www/adonuxt-rp/node_modules/webpack/lib/Compiler.js:474:16
[nodemon] app crashed - waiting for file changes before starting...

Can you demonstrate an example of how to realize the connection between AdonisJS and Nuxt.js through a GraphQL? How to integrate the GraphQL in AdonisJS and use it in the Nuxt.js application?

In express i could use req.session.paramName, but now with adonuxt doesn't works

How to recieve data from adonis, without ajax requests? With use nuxt ssr?

In regards to implementing Vuex Store, where does store/index.js go?
Would it be in the resources directory?

ref: #6

I am always receiving this kind of errors whenever i use jquery.

Error: jQuery requires a window with a document

Thanks everyone.

Not sure if I am the only one. I followed the installation instructions for the adonis cli and the project gets set up, but when I run "npm run dev" I receive an error which reads:

TypeError: (intermediate value).then is not a function at new NuxtController (/Users/~/app/Http/Controllers/NuxtController.js:13:8) at Object.<anonymous> (/Users/~/app/Http/Controllers/NuxtController.js:26:18) at Module._compile (module.js:570:32) at Object.Module._extensions..js (module.js:579:10) at Module.load (module.js:487:32) at tryModuleLoad (module.js:446:12) at Function.Module._load (module.js:438:3) at Module.require (module.js:497:17) at require (internal/module.js:20:19) at requireStack (/Users/~/node_modules/require-stack/src/index.js:44:12) at Object.Ioc._autoLoad (/Users/~node_modules/adonis-fold/src/Ioc/index.js:178:18) at Ioc.use (/Users/~/node_modules/adonis-fold/src/Ioc/index.js:378:18) at /Users/~/server.js:19:3 at fold.Registrar.register.then (/Users/~/bootstrap/http.js:105:9) at process._tickCallback (internal/process/next_tick.js:109:7) at Module.runMain (module.js:606:11)

There is also en error with the logo:
Module parse failed: /Users/~/resources/assets/img/logo.png Unexpected character '�' (1:0) You may need an appropriate loader to handle this file type.

Any ideas?

• .eslintrc.js
• package.json devDependencies
• package.json lint script: standard && eslint --ext .js,.vue resources/

I'm having some issues logging into my app, basically everytime I log in , the app refreshes and doesn't auth the user (it takes a few log in attempts for it actually log the user in).

I want to disable Hot Module Reloading, to rule it out as the problem.

Is it possible to add the lang="nl" property to the wrapper via the nuxt.js config?

How can I pass the value of the request.currentUser property from adonis to vue?

Hey, I seem to be having trouble setting aliases in the config/nuxt.js.

My config includes:

srcDir: resolve(__dirname, '..', 'resources'),
build: {
    extend (config) {
      config.resolve.alias['@'] = this.srcDir,
      config.resolve.alias['test'] =  resolve(__dirname, '..', 'resources')
    },
    loaders: [
      {
        test: /\.(png|jpe?g|gif|svg)$/,
        loader: 'url-loader',
        query: {
          limit: 10000, // 10KO
          name: 'img/[name].[hash].[ext]'
        }
      }
    ]
}

I'm guessing I'm doing something wrong, and I'd really like to get this to work as I'd rather not have ../../ everywhere. So any help is appreciated greatly!!

Earlier you provided an example of appealing to the api. But there is a difficulty: to access the api point you need to be authorized.

Route.group('api', () => {
  Route.resource('users', 'UsersController')
  Route.resource('pages', 'PagesController')
})
.middleware('auth')

On the client side, everything works, but on the server side - I get an error

<template>
<div>{{users}}</div>
</template>

<script>
import axios from '~plugins/axios'

export default {
  async data ({error, req}) {
    const { data } = await axios.get('/api/v1/users.json')
    return {
      users: data
    }
  },
  // async mounted () {
  //  const { data } = await axios.get('api/v1/users.json')
  //  this.users = data
  // }
}
</script>

stemming from: ratiw/vuetable-2#55 (comment)

Vue.js error

TypeError: Cannot redefine property: $url
    at Function.defineProperties (native)
    at plugin (__vue_ssr_bundle__:14550:12)
    at Function.Vue.use (/home/forge/mysite.com/adonuxt/node_modules/vue/dist/vue.runtime.common.js:3452:14)
    at Object.module.exports.Object.defineProperty.value (__vue_ssr_bundle__:4906:15)
    at __webpack_require__ (__vue_ssr_bundle__:21:30)
    at Object.<anonymous> (__vue_ssr_bundle__:11110:3)
    at __webpack_require__ (__vue_ssr_bundle__:21:30)
    at Object.module.exports.Object.defineProperty.value (__vue_ssr_bundle__:5802:93)
    at __webpack_require__ (__vue_ssr_bundle__:21:30)
    at Object.<anonymous> (__vue_ssr_bundle__:11234:3)

I duplicated the error in this adonuxt project:
https://github.com/lmj0011/vuetable2issue

Every time a change is made to the /app the entire project rebuilds, which is taking a considerable amount of time. Is there a way to split the code so that client changes, and server changes are built differently?

I know csrfToken can be accessed within the adonis' built-in view, but for vue template, I'm not sure how to include csrf token in the HTTP request?

Are there any plans of adding a Testing lib to this framework with examples?
I see that Testing is vaguely mentioned in the Adonis.js docs.

I plan to build my own tests with Jasmine

Hi, I want to use Buefy, I try config like nuxt.js but not working.
https://buefy.github.io
Please tell me!!!!!!

Hi,

I am getting the error 'TypeError: Nuxt is not a constructor' on a fresh install when running 'npm run serve:dev'. Here are the steps I took:

1. Install Adonis - npm i -g adonis-cli

2. Create new install - adonis new --blueprint nuxt-community/adonuxt-template adonuxttest

3. cd adonuxttest

4. npm install

5. npm run serve:dev

This is the complete terminal output:

`> [email protected] serve:dev /Users/Dan/Projects/adonuxttest

npm run dev

[email protected] dev /Users/Dan/Projects/adonuxttest
nodemon --watch app --watch bootstrap --watch config --watch .env -x node server.js

[nodemon] 1.11.0
[nodemon] to restart at any time, enter rs
[nodemon] watching: /Users/Dan/Projects/adonuxttest/app//* /Users/Dan/Projects/adonuxttest/bootstrap//* /Users/Dan/Projects/adonuxttest/config/**/* .env
[nodemon] starting node server.js
info adonis:framework +0ms serving app on localhost:3000
TypeError: Nuxt is not a constructor
at new NuxtController (/Users/Dan/Projects/adonuxttest/app/Http/Controllers/NuxtController.js:12:17)
at Object. (/Users/Dan/Projects/adonuxttest/app/Http/Controllers/NuxtController.js:26:18)
at Module._compile (module.js:570:32)
at Object.Module._extensions..js (module.js:579:10)
at Module.load (module.js:487:32)
at tryModuleLoad (module.js:446:12)
at Function.Module._load (module.js:438:3)
at Module.require (module.js:497:17)
at require (internal/module.js:20:19)
at requireStack (/Users/Dan/Projects/adonuxttest/node_modules/require-stack/src/index.js:44:12)
at Object.Ioc._autoLoad (/Users/Dan/Projects/adonuxttest/node_modules/adonis-fold/src/Ioc/index.js:178:18)
at Ioc.use (/Users/Dan/Projects/adonuxttest/node_modules/adonis-fold/src/Ioc/index.js:378:18)
at /Users/Dan/Projects/adonuxttest/server.js:19:3
at fold.Registrar.register.then (/Users/Dan/Projects/adonuxttest/bootstrap/http.js:105:9)
at process._tickCallback (internal/process/next_tick.js:109:7)
at Module.runMain (module.js:606:11)`

Node version - 6.11.0
Adonis version - 2.1.9

Hi there,
I am trying to start a project but getting this error, hope you can help me. Tell me if you need more infos.

C U
thx

I created the folder adonuxt and then
cd adonuxt
npm install -g adonis-cli
cloned your adonuxt template
npm install
npm run dev

C:\xampp\htdocs\DevApps\adonuxt>npm run dev

[email protected] dev C:\xampp\htdocs\DevApps\adonuxt
nodemon --watch app --watch bootstrap --watch config -x node server.js

[nodemon] 1.11.0
[nodemon] to restart at any time, enter rs
[nodemon] watching: C:\xampp\htdocs\DevApps\adonuxt\app//* C:\xampp\htdocs\DevApps\adonuxt\bootstrap//* C:\xampp\htdocs\DevApps\adonuxt\config/**/*
[nodemon] starting node server.js
{ Error: ENOENT: no such file or directory, open 'C:\xampp\htdocs\DevApps\adonuxt.env'
at Error (native)
at Object.fs.openSync (fs.js:641:18)
at Object.fs.readFileSync (fs.js:509:33)
at Object.config (C:\xampp\htdocs\DevApps\adonuxt\node_modules\dotenv\lib\main.js:30:37)
at new Env (C:\xampp\htdocs\DevApps\adonuxt\node_modules\adonis-framework\src\Env\index.js:30:12)
at Object.closure (C:\xampp\htdocs\DevApps\adonuxt\node_modules\adonis-framework\providers\EnvProvider.js:17:14)
at Object.Ioc._resolveProvider (C:\xampp\htdocs\DevApps\adonuxt\node_modules\adonis-fold\src\Ioc\index.js:124:53)
at Object.Ioc.use (C:\xampp\htdocs\DevApps\adonuxt\node_modules\adonis-fold\src\Ioc\index.js:376:18)
at Ioc.use (C:\xampp\htdocs\DevApps\adonuxt\node_modules\adonis-fold\src\Ioc\index.js:380:18)
at fold.Registrar.register.then (C:\xampp\htdocs\DevApps\adonuxt\bootstrap\http.js:45:19)
errno: -4058,
code: 'ENOENT',
syscall: 'open',
path: 'C:\xampp\htdocs\DevApps\adonuxt\.env' }
info adonis:framework +0ms serving app on null:null
TypeError: (intermediate value).then is not a function
at new NuxtController (C:\xampp\htdocs\DevApps\adonuxt\app\Http\Controllers\NuxtController.js:13:8)
at Object. (C:\xampp\htdocs\DevApps\adonuxt\app\Http\Controllers\NuxtController.js:26:18)
at Module._compile (module.js:570:32)
at Object.Module._extensions..js (module.js:579:10)
at Module.load (module.js:487:32)
at tryModuleLoad (module.js:446:12)
at Function.Module._load (module.js:438:3)
at Module.require (module.js:497:17)
at require (internal/module.js:20:19)
at requireStack (C:\xampp\htdocs\DevApps\adonuxt\node_modules\require-stack\src\index.js:44:12)
at Object.Ioc._autoLoad (C:\xampp\htdocs\DevApps\adonuxt\node_modules\adonis-fold\src\Ioc\index.js:178:18)
at Ioc.use (C:\xampp\htdocs\DevApps\adonuxt\node_modules\adonis-fold\src\Ioc\index.js:378:18)
at C:\xampp\htdocs\DevApps\adonuxt\server.js:19:3
at fold.Registrar.register.then (C:\xampp\htdocs\DevApps\adonuxt\bootstrap\http.js:105:9)
at process._tickCallback (internal/process/next_tick.js:109:7)
at Module.runMain (module.js:606:11)

I'm having problems in trying to make a simple POST request to log into my app. I'm calling it in the wrong place it seems, because I can make the call from the Postman app and successfully log in

I'm using the axios lib to make the call.
I was originally making the call from a .vue in the Component directory, then I saw this:
https://nuxtjs.org/faq/async-data-components

The call would go through sometimes, but most of the time it did not. The app refreshes afterwards also.

I see how to make a AJAX call before component rendering:
https://nuxtjs.org/guide/async-data

but how would I make the AJAX call from inside a @click method

~components/LoginForm.vue

<template>
  <div id="app-signin" class="bg-primary">
    <div id="app-signin-container">
      <form id="app-signin-form" class="form-signin">
        <label for="inputEmail" class="sr-only">Username</label>
        <input v-model="username" id="app-signin-username" type="username" class="form-control" placeholder="Username" required autofocus>
        <label for="inputPassword" class="sr-only">Password</label>
        <input v-model="password" id="app-signin-password" type="password" class="form-control" placeholder="Password" required>
        <button class="btn btn-lg btn-primary btn-block" type="submit" @click="signIn">Sign in</button>
      </form>
    </div>
  </div>
</template>

<script>
import $store from '~store/index.js'
import $api from '~assets/js/api.js'

  export default {
    data () {
      return {
        username: '',
        password: ''
      }
    },
    methods: {
      yeah: function () {
        console.log('yeah');
      },
      signIn: function () {
         $api.login(this.username, this.password)
         .then(({ data })=> {
          console.log(data.login);
        
        })
         .catch(err=> {
          console.log(err)
        })

        return
      }
    },
    mounted () {

    }
  }
</script>

There are several middleware in config which is running on every request including nuxt bundles and images (can be ~50-100 per page)

const globalMiddleware = [
  'Adonis/Middleware/Cors',
  'Adonis/Middleware/BodyParser',
  'Adonis/Middleware/Shield',
  'Adonis/Middleware/Flash',
  'Adonis/Middleware/AuthInit'
]

Adonis has support for serving static files (by default from /public folder) but Nuxt doesn't seem to produce static files on disk anywhere in dev mode to be able to configure Adonis to serve static files from there.

package info

[...]
├─ [email protected]
│  ├─ [email protected]
│  ├─ [email protected]
│  ├─ [email protected]
│  ├─ [email protected]
│  ├─ [email protected]
│  ├─ [email protected]
│  ├─ [email protected]
│  ├─ [email protected]
│  └─ [email protected]
├─ [email protected]
├─ [email protected]
├─ [email protected]
├─ [email protected]
│  └─ [email protected]
├─ [email protected]
│  └─ [email protected]
├─ [email protected]
├─ [email protected]
├─ [email protected]
├─ [email protected]
[...]

This is an error I'm getting when HMR takes action on a certain page in my app

webpack built 2f1022134e77b1741f3b in 218ms
  build [==                  ] 10%webpack building...

Build completed in 1.44s

webpack built 2f1022134e77b1741f3b in 1441ms
Build completed in 3.659s

webpack built 8237b64c455a6452ea07 in 3660ms
Hash: 8237b64c455a6452ea07
Version: webpack 2.2.1
Time: 3660ms
               Asset    Size  Chunks  Chunk Names
      nuxt.bundle.js  163 kB       0  app
    vendor.bundle.js  755 kB       1  vendor
  nuxt.bundle.js.map  204 kB       0  app
vendor.bundle.js.map  936 kB       1  vendor

ERROR in ./.nuxt/client.js
Module not found: Error: Can't resolve './middleware' in '/home/forge/www/adonuxt-rp/.nuxt'
 @ ./.nuxt/client.js 6:0-38
 @ multi webpack-hot-middleware/client?reload=true ./.nuxt/client.js

ERROR in ./.nuxt/client.js
Module not found: Error: Can't resolve './index' in '/home/forge/www/adonuxt-rp/.nuxt'
 @ ./.nuxt/client.js 7:0-45
 @ multi webpack-hot-middleware/client?reload=true ./.nuxt/client.js

ERROR in ./.nuxt/client.js
Module not found: Error: Can't resolve './utils' in '/home/forge/www/adonuxt-rp/.nuxt'
 @ ./.nuxt/client.js 8:0-157
 @ multi webpack-hot-middleware/client?reload=true ./.nuxt/client.js
 build [=====               ] 25%./.nuxt/server.js
Module not found: Error: Can't resolve './middleware' in '/home/forge/www/adonuxt-rp/.nuxt'
resolve './middleware' in '/home/forge/www/adonuxt-rp/.nuxt'
  using description file: /home/forge/www/adonuxt-rp/package.json (relative path: ./.nuxt)
  after using description file: /home/forge/www/adonuxt-rp/package.json (relative path: ./.nuxt)
    using description file: /home/forge/www/adonuxt-rp/package.json (relative path: ./.nuxt/middleware)
      as directory
        /home/forge/www/adonuxt-rp/.nuxt/middleware doesn't exist
      no extension
        /home/forge/www/adonuxt-rp/.nuxt/middleware doesn't exist
      .js
        /home/forge/www/adonuxt-rp/.nuxt/middleware.js doesn't exist
      .json
        /home/forge/www/adonuxt-rp/.nuxt/middleware.json doesn't exist
      .vue
        /home/forge/www/adonuxt-rp/.nuxt/middleware.vue doesn't exist
[/home/forge/www/adonuxt-rp/.nuxt/middleware]
[/home/forge/www/adonuxt-rp/.nuxt/middleware]
[/home/forge/www/adonuxt-rp/.nuxt/middleware.js]
[/home/forge/www/adonuxt-rp/.nuxt/middleware.json]
[/home/forge/www/adonuxt-rp/.nuxt/middleware.vue]
 @ ./.nuxt/server.js 9:0-38
./.nuxt/server.js
Module not found: Error: Can't resolve './index' in '/home/forge/www/adonuxt-rp/.nuxt'
resolve './index' in '/home/forge/www/adonuxt-rp/.nuxt'
  using description file: /home/forge/www/adonuxt-rp/package.json (relative path: ./.nuxt)
  after using description file: /home/forge/www/adonuxt-rp/package.json (relative path: ./.nuxt)
    using description file: /home/forge/www/adonuxt-rp/package.json (relative path: ./.nuxt/index)
      as directory
        /home/forge/www/adonuxt-rp/.nuxt/index doesn't exist
      no extension
        /home/forge/www/adonuxt-rp/.nuxt/index doesn't exist
      .js
        /home/forge/www/adonuxt-rp/.nuxt/index.js doesn't exist
      .json
        /home/forge/www/adonuxt-rp/.nuxt/index.json doesn't exist
      .vue
        /home/forge/www/adonuxt-rp/.nuxt/index.vue doesn't exist
[/home/forge/www/adonuxt-rp/.nuxt/index]
[/home/forge/www/adonuxt-rp/.nuxt/index]
[/home/forge/www/adonuxt-rp/.nuxt/index.js]
[/home/forge/www/adonuxt-rp/.nuxt/index.json]
[/home/forge/www/adonuxt-rp/.nuxt/index.vue]
 @ ./.nuxt/server.js 10:0-45
./.nuxt/server.js
Module not found: Error: Can't resolve './utils' in '/home/forge/www/adonuxt-rp/.nuxt'
resolve './utils' in '/home/forge/www/adonuxt-rp/.nuxt'
  using description file: /home/forge/www/adonuxt-rp/package.json (relative path: ./.nuxt)
  after using description file: /home/forge/www/adonuxt-rp/package.json (relative path: ./.nuxt)
    using description file: /home/forge/www/adonuxt-rp/package.json (relative path: ./.nuxt/utils)
      as directory
        /home/forge/www/adonuxt-rp/.nuxt/utils doesn't exist
      no extension
        /home/forge/www/adonuxt-rp/.nuxt/utils doesn't exist
      .js
        /home/forge/www/adonuxt-rp/.nuxt/utils.js doesn't exist
      .json
        /home/forge/www/adonuxt-rp/.nuxt/utils.json doesn't exist
      .vue
        /home/forge/www/adonuxt-rp/.nuxt/utils.vue doesn't exist
[/home/forge/www/adonuxt-rp/.nuxt/utils]
[/home/forge/www/adonuxt-rp/.nuxt/utils]
[/home/forge/www/adonuxt-rp/.nuxt/utils.js]
[/home/forge/www/adonuxt-rp/.nuxt/utils.json]
[/home/forge/www/adonuxt-rp/.nuxt/utils.vue]
 @ ./.nuxt/server.js 11:0-94
Build completed in 5.356s

webpack built 8dd50d0e6442a5596086 in 5352ms

this is the structure of resources/ dir

.
├── assets
│   ├── css
│   ├── img
│   └── js
├── components
│   └── vue-fullcalendar
│       ├── components
│       └── dataMap
├── layouts
├── middleware
├── pages
│   ├── create
│   ├── instances
│   │   └── _id
│   └── users
├── static
└── store

this is the structure of my .nuxt/ dir

.
├── App.vue
├── client.js
├── components
│   ├── nuxt-child.js
│   ├── nuxt-error.vue
│   ├── nuxt-link.js
│   ├── nuxt-loading.vue
│   └── nuxt.vue
├── index.js
├── middleware.js
├── router.js
├── server.js
├── store.js
└── utils.js

I'm not sure how to get user from request session within nuxtServerInit method if the user is logged in via Session Based Authentication. This is a part of my store/index.js:

import Vue from 'vue'
import Vuex from 'vuex'
import axios from 'axios'

Vue.use(Vuex)

const store = new Vuex.Store({

  state: {
    authUser: null,
  },

  mutations: {
    SET_USER: function (state, user) {
      state.authUser = user
    }
  },

  actions: {

    nuxtServerInit ({ commit }, { req }) {
      // req.session is not defined
      if (req.session && req.session.authUser) {
        commit('SET_USER', req.session.authUser)
      }
    },

    // ...

I also tried to get it from an API call within nuxtServerInit but it doesn't work:

    nuxtServerInit ({ commit }) {
      return Promise.resolve(axios.post('/api/checkLogin')
        .then(res => {
          commit('SET_USER', res.data)
        }))
    },

Errors showed up in browser console:

vue.runtime.common.js:521 [Vue warn]: The client-side rendered virtual DOM tree is not matching server-rendered content. This is likely caused by incorrect HTML markup, for example nesting block-level elements inside <p>, or missing <tbody>. Bailing hydration and performing full client-side render. 

[nuxt.js] Cannot load components TypeError: Cannot read property 'toLowerCase' of undefined
    at emptyNodeAt (vue.runtime.common.js:4093)
    at VueComponent.patch [as __patch__] (vue.runtime.common.js:4600)
    at VueComponent.Vue._update (vue.runtime.common.js:2635)
    at VueComponent.updateComponent (vue.runtime.common.js:2609)
    at Watcher.get (vue.runtime.common.js:2934)
    at new Watcher (vue.runtime.common.js:2926)
    at VueComponent.Vue._mount (vue.runtime.common.js:2608)
    at VueComponent.0.Vue$2.$mount (vue.runtime.common.js:6178)
    at init (vue.runtime.common.js:1740)
    at hydrate (vue.runtime.common.js:4496)

Sorry if the title makes no sense. I've just made a fresh project and hit the page. main.css is loaded slowly, and the page us unstyled for a moment then main.css is loaded. The below gif should highlight what I mean better than I can explain.

config/nuxt.js

  /*
  ** Global CSS
  */
  css: ['~assets/css/main.css'],

Is it possible to load in the global CSS file earlier?

There's info on how to make your own ace commands, however I'm not seeing anything that goes into more depth about the default commands. What are the options for the commands?

landan@lj-desktop:~/www/adonuxt_test$ node ace -V
1.0.0
landan@lj-desktop:~/www/adonuxt_test$ node ace -h

  Usage: ace [options] [command]


  Commands:

    greet <name>                      Greet a user with a name
    nuxtbuild                         Build for production the nuxt.js application.
    auth:setup                        Setup migrations and models for authentication
    repl                              Start a new repl session when goodness of Es6 generators
    make:controller [options] <name>  Create a new controller
    route:list                        List all Routes registered for this app
    make:migration [options] <name>   Create a new migration file
    make:model [options] <name>       Create a new model with optional migration
    make:view [options] <name>        Create a new template view by optionally extending a master view
    make:command <name>               Create a new ace command
    make:hook [options] <name>        Create a new hook for your models
    make:middleware [options] <name>  Create a new middleware for Http requests
    make:seed <name>                  Create a new seeder
    make:listener [options] <name>    Create a new listener for your events
    migration:run [options]           Run all pending migrations and optionally seed database
    migration:rollback [options]      Rollback migrations to a given or last batch
    migration:refresh [options]       Refresh migrations by dropping and re-running all migrations
    migration:reset [options]         Reset migrations to latest batch
    db:seed [options]                 Seeds database by running all or a given seed file
    migration:status                  Check migrations current status
    key:generate [options]            Generate encryption key for your application

  Options:

    -h, --help     output usage information
    -V, --version  output the version number

landan@lj-desktop:~/www/adonuxt_test$ 

http://adonisjs.com/docs/3.2/interactive-shell

Can anything be done to get rid of the warnings?

landan@lj-desktop:~/www/adonuxt-rp$ yarn start
yarn start v0.19.1
$ node ./ace nuxtbuild && NODE_ENV=production node server.js 
Building nuxt.js application...
[nuxt:build:client]
 Hash: ec5d955ec342cd86a2a5
Version: webpack 2.2.1
Time: 11156ms
                   Asset       Size  Chunks                    Chunk Names
        5.nuxt.bundle.js    9.04 kB       5  [emitted]         
    img/logo.ffd9a8d.png    23.8 kB          [emitted]         
        0.nuxt.bundle.js     266 kB       0  [emitted]  [big]  
        1.nuxt.bundle.js      30 kB       1  [emitted]         
        2.nuxt.bundle.js      28 kB       2  [emitted]         
        3.nuxt.bundle.js    27.5 kB       3  [emitted]         
        4.nuxt.bundle.js    15.6 kB       4  [emitted]         
img/sae-logo.a4a8224.png    31.5 kB          [emitted]         
        6.nuxt.bundle.js  927 bytes       6  [emitted]         
        7.nuxt.bundle.js    22.8 kB       7  [emitted]         
          nuxt.bundle.js    42.6 kB       8  [emitted]         app
        vendor.bundle.js    93.9 kB       9  [emitted]         vendor
               style.css    2.85 kB       8  [emitted]         app
           style.css.map   86 bytes       8  [emitted]         app

WARNING in asset size limit: The following asset(s) exceed the recommended size limit (250 kB).
This can impact web performance.
Assets: 
  0.nuxt.bundle.js (266 kB)
[nuxt:build:server]
 Hash: 8ef7f90513201b1124d6
Version: webpack 2.2.1
Time: 11189ms
                   Asset     Size  Chunks                    Chunk Names
img/sae-logo.a4a8224.png  31.5 kB          [emitted]         
    img/logo.ffd9a8d.png  23.8 kB          [emitted]         
        server-bundle.js   330 kB       0  [emitted]  [big]  main

WARNING in asset size limit: The following asset(s) exceed the recommended size limit (250 kB).
This can impact web performance.
Assets: 
  server-bundle.js (330 kB)

WARNING in entrypoint size limit: The following entrypoint(s) combined asset size exceeds the recommended limit (250 kB). This can impact web performance.
Entrypoints:
  main (330 kB)
      server-bundle.js


WARNING in webpack performance recommendations: 
You can limit the size of your bundles by using import() or require.ensure to lazy load some parts of your application.
For more info visit https://webpack.js.org/guides/code-splitting/
info adonis:framework +0ms serving app on localhost:4000

I'm unable to navigate to /instances/create from /instances

I have this inside pages/instances/index.vue

[...]

<nuxt-link class="button" to="/instances/create">
   <i class='fa fa-plus'>Create New</i>
 </nuxt-link>

[...]

When I click the button the app stays on the /instances page.
When I move create.vue outside of pages/instances, however, and into the root of pages, I'm able
to navigate to it via /create

How do I pass model data to Nuxt?

Can I still use Lucid?

In the scope of Nuxt, I'm battling to get my "auth" middleware to attach to a page.

I have setup the following: resources/middleware/auth.js

I have tried to attach the middleware to the page vue file with no result.

//resources/pages/users/create.vue
...
<script>
    export default {
        middleware: 'auth'
    }
</script>

My store.state.authUser is set to null in Vue Dev Tools so the user isn't authenticated.
Also I don't see the middleware compiling through webpack.

Any thoughts?

how to set adonis csrf token in fetch or axios calls?

login ({ commit }, { username, password }) {
      return fetch('/api/v1/login', {
        // Send the client cookies to the server
        credentials: 'same-origin',
        method: 'POST',
        headers: {
          'Content-Type': 'application/json'
        },
        body: JSON.stringify({
          username,
          password
        })
      })
        .then((res) => {
          if (res.status === 401) {
            throw new Error('Bad credentials')
          } else {
            return res.json()
          }
        })
        .then((authUser) => {
          commit('SET_USER', authUser)
        })
    },

When making an initial GET request, adonis errors that the connection is refused. When navigating away and back to the route making the request, the response is sent properly.

Snippet:

pages/index.vue

import axios from 'axios'
  
  export default {
    async data ({ route }) {
      await axios.get('/api/v1/dashboard').then((response) => {
        console.log(response)
      }).catch((error) => {
        console.log(error)
      })
      // doing something unrelated
      return {
        path: route.name
      }
    }
  }

app/Http/routes.js

Route.group('version1', function () {
  Route.get('dashboard', function * (request, response) {
    console.log(request, response)
    response.send('got it')
  })
}).prefix('api/v1')
Route.any('*', 'NuxtController.render')

Thanks in advance.

I need help understanding how to produce static files that are ready to be hosted. I have tried using nuxt generate and npm run build to generate static files. In both cases a 'dist' folder is produced with bundled files. Now, I have tried running npm run start for the AdonisJS server in prod mode and my app appears just fine. However, when I try and host my files on surge or now, it doesn't work. None of the bundled files are found and the page doesnt display anything.

I was wondering what steps were needed to produce static files that can be hosted? Would appreciate any insight, thanks.

I've probably missed something, but seeing as there is a catch all route defined for the NuxtController if you post/get to any url e.g an API call its going to try and serve up a page instead.

How do you separate your client requests from your server requests?

The only thing I can find is to use Route.group to create an an subdomain for api requests

Route.group('api', function() {
  Route.post('login', 'UsersController.login')
}).domain('api')

The const status is already defined on the second line, what makes adonis crash. I fixed'it just deleting the second declaration

File: app/Listeners/Http.js

Http.handleError = function * (error, request, response) {
  const status = error.status || 500

  /**
   * DEVELOPMENT REPORTER
   */
  if (Env.get('NODE_ENV') === 'development') {
    const youch = new Youch(error, request.request)
    const type = request.accepts('json', 'html')
    const formatMethod = type === 'json' ? 'toJSON' : 'toHTML'
    const formattedErrors = yield youch[formatMethod]()
    response.status(status).send(formattedErrors)
    return
  }

  /**
   * PRODUCTION REPORTER
   */
  const status = error.status || 500    <--- Right Here baby

  console.error(error.stack)

  if (request.is('html')) {
    yield response.status(status).sendView('errors/index', {error})
    return
  }

  if (request.is('json')) {
    response.status(status).send(error)
    return
  }
}

If you add a simple console.log to the nuxt controller render, it will be executed multiple times.

  * render (request, response) {
    console.log('request');
    this.nuxt.render(request.request, response.response)
  }

when you load the home page, and check the shell output you get.

request
request
request
request
request
request
request
request

Is there a specific reason why this is happening? or is this a bug? One of the biggest problem with this, is that which each time this generator function runs, a new CSRF token will be generated by adonisjs but the rendered page, will only receive the first generated token.

is there an example of using adonis as the renderer & api?

hi, can i use <style lang="scss"> in *.vue files?
it's throw this error:

Module not found: Error: Can't resolve 'sass-loader' in '..\resources\pages'

and the guides says it must add to webpack.config.js but i can't find it!

should i create it? or is another solution?

Hi,

Today I decided to integrate Vuetify to my adonuxt project and I got this:

 ERROR  Failed to compile with 1 errors                                           20:31:04

This dependency was not found:

* vuetify in ./~/babel-loader/lib?{"presets":["vue-app"],"babelrc":false,"cacheDirectory":true}!./~/vue-loader/lib/selector.js?type=script&index=0!./resources/layouts/admin.vue

To install it, you can run: npm install --save vuetify

I put my

import Vuetify from 'vuetify'

into admin.vue file. That's it. Nothing more. Of course i installed it via yarn add vuetify (and yarn add vuetify --dev).
Why this is not working?

I'm stuck on getting Adonis-ally to work with Adonuxt.
http://adonisjs.com/docs/3.2/social-auth

I'm having an issue in rendering the view in the handleCallback

* providerHandleCallback (request, response) {
    const provider = request.param('provider')
    const socialAuthUser = yield request.ally.driver(provider).getUser()

    console.log(socialAuthUser)
    const searchAttr = {
      email: socialAuthUser.getEmail()
    }

    const newUser = {
      email: socialAuthUser.getEmail(),
      username: socialAuthUser.getName(),
      auth_provider: provider,
      auth_provider_id: socialAuthUser.getId()
    }

    const user = yield User.findOrCreate(searchAttr, newUser)

    request.auth.loginViaId(user.id)

    // not sure what to do here, in order to get back to '/' with the authenticated user
    request.request.auth = request.auth
    request.request.auth.user = user
    return this.nuxt.renderRoute('/')
    ///////
  }

How would this be accomplished?

Hello, I'm wondering what would be a good practice to define my API routes.

In route.js Route.any('*', 'NuxtController.render') serves the front-end then how would you proceed to define API routes ? Would you define a subdomain for the group of API routes in routes.js ?

Thank you very much for your help, can't wait to start exploring!

After running API tests with Japa, I get the following error.

landan@lj-desktop:~/www/adonuxt_test$ npm run dev

> [email protected] dev /home/landan/www/adonuxt_test
> npm run watch && node ./ace nuxtbuild && NODE_ENV=development node server.js 


> [email protected] watch /home/landan/www/adonuxt_test
> nodemon --watch app --watch bootstrap --watch config --watch .env

[nodemon] 1.11.0
[nodemon] to restart at any time, enter `rs`
[nodemon] watching: /home/landan/www/adonuxt_test/app/**/* /home/landan/www/adonuxt_test/bootstrap/**/* /home/landan/www/adonuxt_test/config/**/* .env
[nodemon] starting `node server.js`
info adonis:framework +0ms serving app on localhost:4000
webpack built a325d6a2a80074ee8732 in 3918ms
webpack building...
./.nuxt/server.js
Module build failed: Error: ENOENT: no such file or directory, open '/home/landan/www/adonuxt_test/.nuxt/server.js'
    at Error (native)
webpack built 38ed4d989d21060ca708 in 984ms
Hash: 38ed4d989d21060ca708
Version: webpack 2.2.0
Time: 984ms
               Asset     Size  Chunks  Chunk Names
      nuxt.bundle.js  81.3 kB       0  app
    vendor.bundle.js   295 kB       1  vendor
  nuxt.bundle.js.map  90.7 kB       0  app
vendor.bundle.js.map   362 kB       1  vendor

ERROR in ./.nuxt/client.js
Module build failed: Error: ENOENT: no such file or directory, open '/home/landan/www/adonuxt_test/.nuxt/client.js'
    at Error (native)
 @ multi webpack-hot-middleware/client?reload=true ./.nuxt/client.js
webpack built a325d6a2a80074ee8732 in 863ms
webpack built 74d66fc7320d80a25c40 in 4385ms

if I run the tests again the app crashes

webpack built 74d66fc7320d80a25c40 in 5092ms
Entry module not found: Error: Can't resolve '/home/landan/www/adonuxt_test/.nuxt/server.js' in '/home/landan/www/adonuxt_test'
resolve '/home/landan/www/adonuxt_test/.nuxt/server.js' in '/home/landan/www/adonuxt_test'
  using description file: /home/landan/www/adonuxt_test/package.json (relative path: .)
  after using description file: /home/landan/www/adonuxt_test/package.json (relative path: .)
    using description file: /home/landan/www/adonuxt_test/package.json (relative path: ./.nuxt/server.js)
      as directory
        /home/landan/www/adonuxt_test/.nuxt/server.js doesn't exist
      no extension
        /home/landan/www/adonuxt_test/.nuxt/server.js doesn't exist
      .js
        /home/landan/www/adonuxt_test/.nuxt/server.js.js doesn't exist
      .json
        /home/landan/www/adonuxt_test/.nuxt/server.js.json doesn't exist
      .vue
        /home/landan/www/adonuxt_test/.nuxt/server.js.vue doesn't exist

/home/landan/www/adonuxt_test/node_modules/memory-fs/lib/MemoryFileSystem.js:114
                        throw new MemoryFileSystemError(errors.code.ENOENT, _path);
                        ^
Error: no such file or directory
    at MemoryFileSystem.readFileSync (/home/landan/www/adonuxt_test/node_modules/memory-fs/lib/MemoryFileSystem.js:114:10)
    at Watching.handler (/home/landan/www/adonuxt_test/node_modules/nuxt/dist/nuxt.js:783:37)
    at Watching._done (/home/landan/www/adonuxt_test/node_modules/webpack/lib/Compiler.js:94:7)
    at /home/landan/www/adonuxt_test/node_modules/webpack/lib/Compiler.js:74:18
    at Compiler.emitRecords (/home/landan/www/adonuxt_test/node_modules/webpack/lib/Compiler.js:351:37)
    at /home/landan/www/adonuxt_test/node_modules/webpack/lib/Compiler.js:57:19
    at /home/landan/www/adonuxt_test/node_modules/webpack/lib/Compiler.js:344:11
    at next (/home/landan/www/adonuxt_test/node_modules/tapable/lib/Tapable.js:154:11)
    at Compiler.compiler.plugin (/home/landan/www/adonuxt_test/node_modules/webpack/lib/performance/SizeLimitsPlugin.js:99:4)
    at Compiler.applyPluginsAsyncSeries1 (/home/landan/www/adonuxt_test/node_modules/tapable/lib/Tapable.js:158:13)
    at Compiler.afterEmit (/home/landan/www/adonuxt_test/node_modules/webpack/lib/Compiler.js:341:8)
    at Compiler.<anonymous> (/home/landan/www/adonuxt_test/node_modules/webpack/lib/Compiler.js:336:14)
    at /home/landan/www/adonuxt_test/node_modules/webpack/node_modules/async/dist/async.js:356:16
    at eachOfArrayLike (/home/landan/www/adonuxt_test/node_modules/webpack/node_modules/async/dist/async.js:929:9)
    at eachOf (/home/landan/www/adonuxt_test/node_modules/webpack/node_modules/async/dist/async.js:991:5)
    at Object.eachLimit (/home/landan/www/adonuxt_test/node_modules/webpack/node_modules/async/dist/async.js:3089:3)
[nodemon] app crashed - waiting for file changes before starting...

throw new MemoryFileSystemError(errors.code.ENOENT, _path);

I just looked inside the .nuxt folder and all of the files are gone.
Is there something I can change in config, to keep the files in .nuxt intact?

I think this may be due to webpack trying to rebuild files, while my functional tests are running

Hi, I build a Login with github but can't redirect to dashboard.
const user = yield User.findOrCreate(searchAttr, newUser) yield request.auth.loginViaId(user.id) return this.nuxt.renderRoute('/admin')
Please help me!!!!!!

🚨 You need to enable Continuous Integration on all branches of this repository. 🚨

To enable Greenkeeper, you need to make sure that a commit status is reported on all branches. This is required by Greenkeeper because we are using your CI build statuses to figure out when to notify you about breaking changes.

Since we did not receive a CI status on the greenkeeper/initial branch, we assume that you still need to configure it.

If you have already set up a CI for this repository, you might need to check your configuration. Make sure it will run on all new branches. If you don’t want it to run on every branch, you can whitelist branches starting with greenkeeper/.

We recommend using Travis CI, but Greenkeeper will work with every other CI service as well.

Once you have installed CI on this repository, you’ll need to re-trigger Greenkeeper’s initial Pull Request. To do this, please delete the greenkeeper/initial branch in this repository, and then remove and re-add this repository to the Greenkeeper integration’s white list on Github. You'll find this list on your repo or organiszation’s settings page, under Installed GitHub Apps.

Seems we're out of date!

Compare:
https://github.com/adonisjs/adonis-app/blob/develop/app/Listeners/Http.js

With:
https://github.com/nuxt/adonuxt/blob/master/app/Listeners/Http.js

For whatever reason, it was swallowing any uncaught exceptions.

This error seems to happen when I log out my app or try to access a route directly via entering an url in the browser

Vue.js error

TypeError: Cannot redefine property: $url
    at Function.defineProperties (native)
    at plugin (__vue_ssr_bundle__:14550:12)
    at Function.Vue.use (/home/forge/mysite.com/adonuxt/node_modules/vue/dist/vue.runtime.common.js:3452:14)
    at Object.module.exports.Object.defineProperty.value (__vue_ssr_bundle__:4906:15)
    at __webpack_require__ (__vue_ssr_bundle__:21:30)
    at Object.<anonymous> (__vue_ssr_bundle__:11110:3)
    at __webpack_require__ (__vue_ssr_bundle__:21:30)
    at Object.module.exports.Object.defineProperty.value (__vue_ssr_bundle__:5802:93)
    at __webpack_require__ (__vue_ssr_bundle__:21:30)
    at Object.<anonymous> (__vue_ssr_bundle__:11234:3)