wobsoriano / numix

Write your server code inside Vue SFC's and handle forms easily.

Numix

Add remix-like loaders and actions to your Nuxt page components.

<script lang="ts">
import { prisma } from '@/lib/prisma.server'

export async function loader() {
  const products = await prisma.product.findMany()
  return products
}
</script>

<script setup lang="ts">
const { data } = await useLoaderData<typeof loader>()
</script>

<template>
  <div>
    <h1>Products</h1>
    <div v-for="product in data" :key="product.id">
      {{ product.name }}
    </div>
  </div>
</template>

Documentation

For documentation about Numix please visit https://numix.vercel.app.

Development

• Run cp playground/.env.example playground/.env
• Run pnpm dev:prepare to generate type stubs.
• Use pnpm dev to start playground in development mode.

License

MIT

numix's Issues

postinstall command blocks the installation

Hi,
The package postinstall command runs after installation and fails. please consider using prepare instead.

node_modules/.pnpm/[email protected]/node_modules/numix: Running postinstall script, failed in 29ms
.../.pnpm/[email protected]/node_modules/numix postinstall$ cd playground && npx prisma migrate dev --name init && npx prisma db seed
│ sh: line 1: cd: playground: No such file or directory
└─ Failed in 29ms
Progress: resolved 600, reused 578, downloaded 0, added 0, done
 ELIFECYCLE  Command failed with exit code 1.

Nested routes are not supported

Problem:

A huge part of what makes Remix great is loading of nested data. Unfortunately, as of now, this seems not to be supported by this plugin yet.

Reproduction:

• Create a pages/foo.vue file
• Create a pages/foo/[slug].vue file
• Add loaders to both
• Navigate to foo/1
• Only the loader of the root page component is resolved

See: https://stackblitz.com/edit/nuxt-starter-mwn1xp?file=pages%2Ffoo%2F[slug].vue&initialpath=/foo/1

question about numix and nuxt

Hi wob, sorry for opening an issue here but I thought it would be fast to reach you that way.
I'm a big fan of your libraries in general, and just stumbled upon this one.
I did not know it existed, and end-up doing something very similar with

https://github.com/Hebilicious/form-actions-nuxt

I recently joined the unjs team, and I hope that we'll be able to add this pattern in Nuxt core one day.
Would you like to collaborate together ?

Nuxt fails to load

Just testing out the getting started instructions and I get the following error when running nuxt dev

I get the following warning:

'D:/git/numix-test/.nuxt/numix-handler.mjs' is imported by virtual:#internal/nitro/virtual/server-handlers, but could not be resolved – treating it as an external dependency

I get the following error:

[worker reload] [worker init] Cannot find module 'D:\.nuxt\numix-handler.mjs' imported from D:\git\numix-test\.nuxt\dev\index.mjs  

Loading data in index.vue not possible

Problem:

Using this pluin within the root index.vue file leads to a 500 error Cannot read properties of null.

Reproduction:

• Create a pages/index.vue File
• Add loader and userLoaderData()

See: https://stackblitz.com/edit/nuxt-starter-mwn1xp?file=pages%2Findex.vue

Looking forward to using this plugin!