Slice Simulator Nuxt 3

Hello,

I am trying to setup with Prismic 3 and Nuxt 3 version, and get this error:
We can’t connect to the simulator page

[Vue warn]: Unhandled error during execution of render function
  at <SliceSimulator state= { slices: { components: { image_push: [Object] } } } >
[nuxt] [request error] h is not a function
  at Proxy.render (./node_modules/@prismicio/slice-simulator-vue/dist/index.js:75:12)

and in slice machine client console I am getting this error:

Uncaught SyntaxError: 
The requested module '/_nuxt/node_modules/escape-html/index.js?v=c4e61d85' 
does not provide an export named 'default' 
(at http://localhost:3000/_nuxt/node_modules/@prismicio/helpers/dist/index.js?v=c4e61d85:4:8)

Hi Tadas,

Slice Machine does not yet support Nuxt 3, but the team is working on this :slight_smile:

Thanks.

1 Like

Hey!

Im trying to use prismic and slicemachine on a nuxt 3 project. I did the command npx @slicemachine/init
and get this error message.

⠏ Downloading Slice Machinenode:internal/errors:841
  const err = new Error(message);
              ^

Error: Command failed: npm install --save @nuxtjs/prismic @prismicio/slice-simulator-vue
npm ERR! code ERESOLVE
npm ERR! ERESOLVE could not resolve
npm ERR! 
npm ERR! While resolving: undefined@undefined
npm ERR! Found: vue@3.2.33
npm ERR! node_modules/vue
npm ERR!   peer vue@"3.2.33" from @nuxt/vite-builder@3.0.0-rc.3
npm ERR!   node_modules/@nuxt/vite-builder
npm ERR!     @nuxt/vite-builder@"^3.0.0-rc.3" from nuxt@3.0.0-rc.3
npm ERR!     node_modules/nuxt
npm ERR!       dev nuxt@"3.0.0-rc.3" from the root project
npm ERR!   peer vue@"^3.0.0" from @prismicio/vue@3.0.0-beta.6
npm ERR!   node_modules/@prismicio/vue
npm ERR!     @prismicio/vue@"^3.0.0-beta" from @nuxtjs/prismic@3.0.0-alpha.5
npm ERR!     node_modules/@nuxtjs/prismic
npm ERR!       dev @nuxtjs/prismic@"^3.0.0-alpha.5" from the root project
npm ERR!   5 more (@vitejs/plugin-vue, @vue/server-renderer, ...)
npm ERR! 
npm ERR! Could not resolve dependency:
npm ERR! @prismicio/slice-simulator-vue@"*" from the root project
npm ERR! 
npm ERR! Conflicting peer dependency: vue@2.6.14
npm ERR! node_modules/vue
npm ERR!   peer vue@"^2.6.0" from @prismicio/slice-simulator-vue@0.2.1
npm ERR!   node_modules/@prismicio/slice-simulator-vue
npm ERR!     @prismicio/slice-simulator-vue@"*" from the root project
npm ERR! 
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force, or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.
npm ERR! 
npm ERR! See /Users/victorpettersson/.npm/eresolve-report.txt for a full report.

npm ERR! A complete log of this run can be found in:
npm ERR!     /Users/victorpettersson/.npm/_logs/2022-05-23T10_55_45_736Z-debug-0.log

    at ChildProcess.exithandler (node:child_process:398:12)
    at ChildProcess.emit (node:events:527:28)
    at maybeClose (node:internal/child_process:1092:16)
    at Process.ChildProcess._handle.onexit (node:internal/child_process:302:5) {
  code: 1,
  killed: false,
  signal: null,
  cmd: 'npm install --save @nuxtjs/prismic @prismicio/slice-simulator-vue',
  stdout: '',
  stderr: 'npm ERR! code ERESOLVE\n' +
    'npm ERR! ERESOLVE could not resolve\n' +
    'npm ERR! \n' +
    'npm ERR! While resolving: undefined@undefined\n' +
    'npm ERR! Found: vue@3.2.33\n' +
    'npm ERR! node_modules/vue\n' +
    'npm ERR!   peer vue@"3.2.33" from @nuxt/vite-builder@3.0.0-rc.3\n' +
    'npm ERR!   node_modules/@nuxt/vite-builder\n' +
    'npm ERR!     @nuxt/vite-builder@"^3.0.0-rc.3" from nuxt@3.0.0-rc.3\n' +
    'npm ERR!     node_modules/nuxt\n' +
    'npm ERR!       dev nuxt@"3.0.0-rc.3" from the root project\n' +
    'npm ERR!   peer vue@"^3.0.0" from @prismicio/vue@3.0.0-beta.6\n' +
    'npm ERR!   node_modules/@prismicio/vue\n' +
    'npm ERR!     @prismicio/vue@"^3.0.0-beta" from @nuxtjs/prismic@3.0.0-alpha.5\n' +
    'npm ERR!     node_modules/@nuxtjs/prismic\n' +
    'npm ERR!       dev @nuxtjs/prismic@"^3.0.0-alpha.5" from the root project\n' +
    'npm ERR!   5 more (@vitejs/plugin-vue, @vue/server-renderer, ...)\n' +
    'npm ERR! \n' +
    'npm ERR! Could not resolve dependency:\n' +
    'npm ERR! @prismicio/slice-simulator-vue@"*" from the root project\n' +
    'npm ERR! \n' +
    'npm ERR! Conflicting peer dependency: vue@2.6.14\n' +
    'npm ERR! node_modules/vue\n' +
    'npm ERR!   peer vue@"^2.6.0" from @prismicio/slice-simulator-vue@0.2.1\n' +
    'npm ERR!   node_modules/@prismicio/slice-simulator-vue\n' +
    'npm ERR!     @prismicio/slice-simulator-vue@"*" from the root project\n' +
    'npm ERR! \n' +
    'npm ERR! Fix the upstream dependency conflict, or retry\n' +
    'npm ERR! this command with --force, or --legacy-peer-deps\n' +
    'npm ERR! to accept an incorrect (and potentially broken) dependency resolution.\n' +
    'npm ERR! \n' +
    'npm ERR! See /Users/victorpettersson/.npm/eresolve-report.txt for a full report.\n' +
    '\n' +
    'npm ERR! A complete log of this run can be found in:\n' +
    'npm ERR!     /Users/victorpettersson/.npm/_logs/2022-05-23T10_55_45_736Z-debug-0.log\n'
}

Also when I try to install slice-simulator with npm i --save prismicio/slice-simulator-vue

I get this 

npm ERR! code 128
npm ERR! An unknown git error occurred
npm ERR! command git --no-replace-objects ls-remote ssh://git@github.com/prismicio/slice-simulator-vue.git
npm ERR! ERROR: Repository not found.
npm ERR! fatal: Could not read from remote repository.
npm ERR! 
npm ERR! Please make sure you have the correct access rights
npm ERR! and the repository exists.

npm ERR! A complete log of this run can be found in:
npm ERR!     /Users/victorpettersson/.npm/_logs/2022-05-23T11_12_42_833Z-debug-0.log

Do you guys not why? I use node 16
and my package.json looks like this
{
  "private": true,
  "scripts": {
    "build": "nuxt build",
    "dev": "nuxt dev",
    "generate": "nuxt generate",
    "preview": "nuxt preview"
  },
  "devDependencies": {
    "@nuxtjs/prismic": "^3.0.0-alpha.5",
    "autoprefixer": "^10.4.7",
    "nuxt": "3.0.0-rc.3",
    "postcss": "^8.4.14",
    "slice-machine-ui": "^0.3.7",
    "tailwindcss": "^3.0.24"
  },
  "dependencies": {
    "gsap": "^3.10.4",
    "vite-svg-loader": "^3.3.0"
  }
}

Hi Victor,

Slice Machine does not yet support Nuxt 3, but the team is working on this :slight_smile:

Thanks.

3 Likes