Updated Slicemachine - Build failling "@/prismicio"' has no exported member 'repositoryName'

Hello,

I have just done the updated of Slicemachine with Yarn, now I cannot build anymore. I get:

./pages/_app.tsx:12:10
Type error: Module '"@/prismicio"' has no exported member 'repositoryName'.

It used to work like a charm before a huge slicemachine update that deleted & modified everything basically.

I have tried what is mentioned in this thread: Module '"@prismicio/client"' has no exported member 'Content' - #8 by Acen

in vain.


What needs to change following slicemachine update??

Tried to fix it about an hour, still not manage to do it.

I have updated the repositoryName to be fetched of slicemachine.config.json now:

export const endpoint = slicemachine.apiEndpoint
export const repositoryName = prismic.getRepositoryName(endpoint)

...
import * as prismic from '@prismicio/client'
import * as prismicNext from '@prismicio/next'
// import sm from './sm.json'
import slicemachine from './slicemachine.config.json'

export const createClient = (config = {}) => {
  const client = prismic.createClient(slicemachine.apiEndpoint, {
    routes,
    ...config
  })

  prismicNext.enableAutoPreviews({
    client,
    previewData: config.previewData,
    req: config.req
  })

  return client
}

Still getting Module '"@/prismicio"' has no exported member 'repositoryName'.ts(2305) in _app.tsx

My tsconfig.json does include everything it supposed to IMO:


  "include": [
    "next-env.d.ts",
    ".slicemachine/prismicio.d.ts", // here
    "**/*.ts",
    "**/*.tsx",
    "**/*.jsx",
    "pages/.....",
    "prisma/seed.mjs"
  ],
  "exclude": ["node_modules"]
}

What the issue here?

Is it possible to be a bug from your end with the new slicemachine update & typescript?

Hello @Marving.

Everything works fine for me like this:

slicemachine.config.json:

{
  "apiEndpoint": "https://your-repository-name.prismic.io/api/v2",
  "repositoryName": "your-repository-name",
  "adapter": "@slicemachine/adapter-next",
  "libraries": ["./slices"],
  "localSliceSimulatorURL": "http://localhost:3000/slice-simulator"
}

prismicio.ts:

import * as prismic from "@prismicio/client";
import sm from "./slicemachine.config.json";

export const repositoryName = prismic.getRepositoryName(sm.apiEndpoint);

And using repositoryName in _app.tsx:

import { repositoryName } from "../prismicio";

...
<PrismicPreview repositoryName={repositoryName}>
  <Component {...pageProps} />
</PrismicPreview>
...

Hope this helps)

Hello @Marving

Thanks for posting this to us. This way, we can solve potential bugs as soon as possible.

Have you tried the solution posted by @vagmen27? Let me know if it works for you too. I will pass this along with my dedicated team to resolve this bug.

Thanks,
Priyanka

Hello, Thanks for jumping in @vagmen27 and @Priyanka.
@vagmen27, have you done the last update of slicemachine?
Because that's exactly what I was doing before the update, and it worked fine.
Now, slicemachine is recommending me to DELETE sm.json as it is deprecated and use only slicemachine.config.json:

{
  "apiEndpoint": "https://xxxx.prismic.io/api/v2",
  "repositoryName": "xxx",
  "adapter": "@slicemachine/adapter-next",
  "libraries": ["./slices"],
  "localSliceSimulatorURL": "http://localhost:3000/slice-simulator"
}

And so I have tried with one than the other, both fail now. I get the same error in _app.tsx :

Module '"../prismicio"' has no exported member 'repositoryName'.

from:
// import { repositoryName } from '@/prismicio'
import { repositoryName } from '../prismicio'

Yes, I have slicemachine version 1.0.0 installed.
And yes, I removed sm.json. I use only slicemachine.config.json.

Most likely you have a problem in the prismicio.ts file. You need to add three lines as I wrote above:

import * as prismic from "@prismicio/client";
import sm from "./slicemachine.config.json";

export const repositoryName = prismic.getRepositoryName(sm.apiEndpoint);

After that you can import repositoryName in _app.tsx file

If that doesn't work, then please show the contents of the prismicio.ts file

Deleted my previous post, as it seems that the issue is persisting...

It seems like this update destroyed all the typescript configuration.

Now I am back getting the issue:

./pages/_app.tsx:13:10
Type error: Module '"../prismicio"' has no exported member 'repositoryName'.

  11 | import { PrismicPreview } from '@prismicio/next'
  12 | // import { repositoryName } from '@/prismicio'
> 13 | import { repositoryName } from '../prismicio'

extract from the slicemachine.config.json:

t{
  "apiEndpoint": "https://xxx.prismic.io/api/v2",
  "repositoryName": "xxx",
  "adapter": "@slicemachine/adapter-next",
  "libraries": ["./slices"],
  "localSliceSimulatorURL": "http://localhost:3000/slice-simulator"
}

here is the prismic.js file:

import * as prismicNext from '@prismicio/next'
import * as prismic from '@prismicio/client'
import sm from './slicemachine.config.json'

/**
 * The project's Prismic repository name.
 */
export const repositoryName = prismic.getRepositoryName(sm.apiEndpoint)

/** @type {prismic.ClientConfig['routes']} **/
const routes = [
  {
    type: 'blog_homepage',
    path: '/blog'
  },
  {
    type: 'blog_post',
    path: '/blog/:uid'
  },
  {
    type: 'page',
    path: '/:uid'
  },
 ....
]

/**
 * Creates a Prismic client for the project's repository. The client is used to
 * query content from the Prismic API.
 *
 * @param config {prismicNext.CreateClientConfig} - Configuration for the Prismic client.
 */
export const createClient = (config = {}) => {
  const client = prismic.createClient(sm.apiEndpoint, {
    routes,
    ...config
  })

  prismicNext.enableAutoPreviews({
    client,
    previewData: config.previewData,
    req: config.req
  })

  return client
}

As we do not have libraries-state.json anymore, I had to swap "state" to localSliceSimulatorURL in the slice-simulator.jsx
slice-simulator.jsx:

import { SliceSimulator } from '@prismicio/slice-simulator-react'
import { SliceZone } from '@prismicio/react'
import { components } from '@/slices'
// import state from '@/.slicemachine/libraries-state.json'
import localSliceSimulatorURL from '@/slicemachine.config.json'

const SliceSimulatorPage = () => {
  return (
    <SliceSimulator
      sliceZone={({ slices }) => (
        <SliceZone slices={slices} components={components} />
      )}
      state={localSliceSimulatorURL}
    />
  )
}

tsconfig.json:

{
  "ts-node": {
    "compilerOptions": {
      "module": "commonjs"
    }
  },
  "compilerOptions": {
    "target": "es5",
    "lib": ["dom", "dom.iterable", "esnext"],
    "allowJs": true,
    "skipLibCheck": true,
    "strict": true,
    "forceConsistentCasingInFileNames": true,
    "noEmit": true,
    "noImplicitAny": false,
    "esModuleInterop": true,
    "module": "esnext",
    "moduleResolution": "node",
    "resolveJsonModule": true,
    "isolatedModules": true,
    "jsx": "preserve",
    "incremental": true,
    "baseUrl": ".",
    "paths": {
      "@/*": ["./*"]
    }
  },
  "include": [
    "next-env.d.ts",
    ".slicemachine/prismicio.d.ts",
    ".slicemachine/prismicio.d.ts",
    "**/*.ts",
    "**/*.tsx",
    "**/*.jsx",
   ....
    "prisma/seed.mjs"
  ],
  "exclude": ["node_modules"]
}

Try renaming prismic.js to prismicio.ts
And then restart the project.

I also noticed that you still have the path to the remote .slicemachine/prismicio.d.ts file in tsconfig.json.
So the prismicio types will not be available.
See here for a solution to this problem.

Thanks man. The error has now evolved.

I had to create a type/interface in prismicio.ts for not having prismic.createClient failling:

/**
 * Creates a Prismic client for the project's repository. The client is used to
 * query content from the Prismic API.
 *
 * @param config {prismicNext.CreateClientConfig} - Configuration for the Prismic client.
 */
interface CreateClientConfig extends prismic.ClientConfig {
  previewData?: any
  req?: any
}

but now, it seems that it has destroy my custom path ""@/": ["./"]" in tsconfig.json that I was using to export all my components like:

import AppLayout from '@/components/AppLayout'

Now all of them get highlighted, even the standard tag (cf images):


Is there something else that I need to edit to make it work as it used to before the update?

Hello @Marving, I have got an update from the team. We are about to release a fix by today. I will keep you updated. Thanks.

Hello @Marving, The issue has been fixed with the latest version. Can you try and confirm?

1 Like

Allgood indeed. Juste had to delete manually the previous prismicio-types.d.ts as the patch created a duplicate