I have been trying to get Vuex (inside of Nuxt.js) to work with a SQLite database using Bookshelf.js and Knex.js. I have been able to get Bookshelf to function outside of Nuxt, but when I put the same code inside of Nuxt, I get this in my browser console upon running a model:
bluebird.js:1542
Unhandled rejection TypeError: _this.driver.Database is not a constructor
acquireRawConnection/<@http://localhost:3000/_nuxt/pages/testing.e359f91ab7a42b76ee09.js:38103:16
acquireRawConnection@http://localhost:3000/_nuxt/pages/testing.e359f91ab7a42b76ee09.js:38102:12
create@http://localhost:3000/_nuxt/pages/testing.e359f91ab7a42b76ee09.js:32558:9
_createResource@http://localhost:3000/_nuxt/pages/testing.e359f91ab7a42b76ee09.js:29271:3
dispense@http://localhost:3000/_nuxt/pages/testing.e359f91ab7a42b76ee09.js:29231:5
acquire@http://localhost:3000/_nuxt/pages/testing.e359f91ab7a42b76ee09.js:29353:3
acquireConnection/<@http://localhost:3000/_nuxt/pages/testing.e359f91ab7a42b76ee09.js:32608:7
From previous event:
acquireConnection@http://localhost:3000/_nuxt/pages/testing.e359f91ab7a42b76ee09.js:32599:12
ensureConnection/</<@http://localhost:3000/_nuxt/pages/testing.e359f91ab7a42b76ee09.js:42442:16
From previous event:
ensureConnection/<@http://localhost:3000/_nuxt/pages/testing.e359f91ab7a42b76ee09.js:42440:35
From previous event:
ensureConnection@http://localhost:3000/_nuxt/pages/testing.e359f91ab7a42b76ee09.js:42439:12
run@http://localhost:3000/_nuxt/pages/testing.e359f91ab7a42b76ee09.js:42285:37
["./node_modules/knex/lib/interface.js"]/exports.default/Target.prototype.then@http://localhost:3000/_nuxt/pages/testing.e359f91ab7a42b76ee09.js:39654:18
I am using the same setup I used outside of Nuxt, but now it isn't working. This makes me think that the issue is on Nuxt's side.
P.S. If I am doing anything wrong or if there is a better way to achieve this (have Vuex interact with a database), please tell me
To reproduce error (may upload repo in the morning; getting late): 1. Make a new Nuxt project
vue init nuxt/starter bug-test
cd bug-test
npm install
npm install bookshelf knex
npm install sqlite3@3.1.11 --save-exact # 3.1.12 causes bug which makes it impossible to `npm install`
mkdir database
cd database
sqlite3 db.sqlite
# SQLite version 3.20.1...
sqlite> create table blank; # not adding columns causes it to fail but still write a file; not best method but works
sqlite> .exit
Add Bookshelf.js files (add these to database/
directory; same as db.sqlite)
module.exports = {
client: 'sqlite3',
connection: {
filename: 'db.sqlite'
},
useNullAsDefault: true
}
bookshelf.js
let knex = require('knex')(require('./knexfile'))
let bookshelf = require('bookshelf')(knex)
module.exports = bookshelf
exports.up = function (knex) {
return knex.schema
.createTable('users', table => {
table.increments('id').primary()
table.string('firstName')
table.string('lastName')
table.string('emailAddress')
})
}
exports.down = function (knex) {
return knex.schema
.dropTable('users')
}
models/users.js
var bookshelf = require('../bookshelf')
var Users = bookshelf.Model.extend({
tableName: 'users'
})
module.exports = Users
<template lang="html">
<section>
<h1>Testing Page</h1>
<pre>{{users}}</pre>
</section>
</template>
<script>
import Users from '~/database/models/users'
export default {
computed: {
users () {
let users
Users.fetchAll().then(function (contact) { users = contact.toJSON() })
return users
}
}
}
</script>
cd ../ # if still in database/ or pages/
./node_modules/.bin/knex migrate:latest --knexfile database/knexfile.js
npm run dev
Any help/feedback appreciated
<!--cmty--><!--cmty_prevent_hook--><div align="right"><sub><em>This question is available on <a href="https://nuxtjs.cmty.io">Nuxt.js</a> community (<a href="https://nuxtjs.cmty.io/nuxt/nuxt.js/issues/c1569">#c1569</a>)</em></sub></div>