search

protonemedia / inertiajs-tables-laravel-query-builder

Inertia.js Tables for Laravel Query Builder
https://protone.media/en/blog/introducing-inertiajs-tables-a-datatables-like-package-for-laravel-query-builder
MIT License
438 stars 123 forks source link

[2.x] Production build not working in Vite projects #69

Closed pascalbaljet closed 2 years ago

pascalbaljet commented 2 years ago

When using the library in a Laravel project that uses Vite, you'll find this error in the browser console: currentRenderingInstance is null. The test suite, a regular Laravel app with Laravel Mix, uses Webpack and works fine.

From searching the web, it seems the library is using the wrong Vue instance (at least not the one from the app). On the other hand, it looks like the Vite config is set up correctly.

https://github.com/protonemedia/inertiajs-tables-laravel-query-builder/blob/e8c38d170f9f0ab52f19e4c456aa026dbbba1f88/vite.config.js#L20

From inspecting the build manually, I can see Vue is not included in the library, which is good.

Any help would be appreciated!

pascalbaljet commented 2 years ago

There is a workaround! Add this to your Vite config:

https://github.com/protonemedia/inertiajs-tables-laravel-query-builder/blob/52085954bd48e2ac1df97688b98202f84aa0c10c/app/vite.config.js#L7-L11

It increases the size of the app.js build but decreases the size of the inertia-tables-etc.js build, so it seems to be moving stuff around.

% npm run build

> build
> vite build

vite v2.9.13 building for production...
✓ 395 modules transformed.
public/build/manifest.json                                                  1.27 KiB
public/build/assets/CustomTable.4c10cd7f.js                                 0.50 KiB / gzip: 0.34 KiB
public/build/assets/TwoTables.0d923f56.js                                   0.52 KiB / gzip: 0.31 KiB
public/build/assets/Users.31bc86fb.js                                       0.42 KiB / gzip: 0.32 KiB
public/build/assets/app.15ef2060.css                                        22.71 KiB / gzip: 4.78 KiB
public/build/assets/inertiajs-tables-laravel-query-builder.es.bfea688d.js   125.59 KiB / gzip: 43.15 KiB
public/build/assets/app.797b0635.js                                         184.36 KiB / gzip: 66.05 KiB

% npm run build

> build
> vite build

vite v2.9.13 building for production...
✓ 400 modules transformed.
public/build/manifest.json                                                  1.27 KiB
public/build/assets/CustomTable.65cbee34.js                                 0.50 KiB / gzip: 0.34 KiB
public/build/assets/TwoTables.5e1487f0.js                                   0.52 KiB / gzip: 0.31 KiB
public/build/assets/Users.7ed78ef6.js                                       0.42 KiB / gzip: 0.32 KiB
public/build/assets/app.15ef2060.css                                        22.71 KiB / gzip: 4.78 KiB
public/build/assets/inertiajs-tables-laravel-query-builder.es.db97e4c2.js   97.90 KiB / gzip: 32.35 KiB
public/build/assets/app.eeb46a26.js                                         248.28 KiB / gzip: 91.79 KiB
Priet commented 2 years ago

I don't know if it's related, but I had to add :inertia=$inertia to the Table tag:

<Table :resource="users" :inertia="$inertia">

I'm using Vite.

donmbelembe commented 2 years ago

dear @pascalbaljet can you try with vite vertion 3 ? because I'm not having this issue with vite version 3

donmbelembe commented 2 years ago

I can confirm that with vite 3 I don't have this issue

pascalbaljet commented 2 years ago

I tagged a new npm package (v2.1) which works correctly with Vite 3. The demo has also been updated to Vite 3.

blogui91 commented 2 years ago

Hello @pascalbaljet, Projects with Laravel mix won't work anymore after the latest version released?

hasan-juraev commented 1 year ago

Hello, I am using Datatables from protonmedia with Laravel Inertia Vite compiler, but I am also having an error stated "Cannot resolve file 'inertiajs-tables-laravel-query-builder'. I was not able to find any solution on the internet, please help me to solve my issue. Thank you!