Error after deploy

[harperaa]

Hi, I have a new sanity project and dataset, but when I install your new plugin, I get the following error.

Uncaught error: ka.default.div is not a function https://redacted.sanity.studio/static/sanity-8e416fe2.js:184:141 TypeError: ka.default.div is not a function at https://redacted.sanity.studio/static/sanity-8e416fe2.js:184:141

Setup. npx sanity init ... Project output path: redacted... ... cd redacted

yarn install sanity-plugin-seo-pane

sanity.config.js: import { SeoToolsPane } from 'sanity-plugin-seo-pane' ... plugins: [deskTool(), SeoToolsPane() ], ...

npx sanity deploy ... ✔ Checking project info Your project has not been assigned a studio hostname. To deploy your Sanity Studio to our hosted Sanity.Studio service, you will need one. Please enter the part you want to use. ? Studio hostname (.sanity.studio): redacted ✔ Clean output folder (6ms) ✔ Build Sanity Studio (109475ms) ✔ Verifying local content ✔ Deploying to Sanity.Studio

Success! Studio deployed to https://redacted.sanity.studio/

then, browsing to above url...error...

btw, second time I tried, got a slightly different error...

Uncaught error: Be.default.div is not a function https://redacted.sanity.studio/static/sanity-2053d182.js:3055:141 TypeError: Be.default.div is not a function at https://redacted.sanity.studio/static/sanity-2053d182.js:3055:141

[harperaa]

I see now, I was adding it wrong to the sanity.config.js, needed to complete the deskStructure.js, then import that and add that as parameter to the deskTools() plugin...as follows:

import { getDefaultDocumentNode } from './deskStructure' ... plugins: [deskTool({ getDefaultDocumentNode }),...

However, I do note that I got the following warnings when deploying... ✔ Clean output folder (2ms) ⠼ Build Sanity Studio"part:@sanity/base/schema" is imported by "part:@sanity/base/schema?commonjs-external", but could not be resolved – treating it as an external dependency. "part:@sanity/data-aspects/resolver" is imported by "part:@sanity/data-aspects/resolver?commonjs-external", but could not be resolved – treating it as an external dependency. "part:@sanity/base/util/document-action-utils" is imported by "part:@sanity/base/util/document-action-utils?commonjs-external", but could not be resolved – treating it as an external dependency. "part:@sanity/base/client" is imported by "part:@sanity/base/client?commonjs-external", but could not be resolved – treating it as an external dependency. "part:@sanity/desk-tool/structure?" is imported by "part:@sanity/desk-tool/structure??commonjs-external", but could not be resolved – treating it as an external dependency. ✔ Build Sanity Studio (90442ms)

How do I prevent those warnings. I am not sure if related, but I do notice that even after build and load into Studio, I don't see the view for SEO... clearly, I am missing something... probably other parts of the deskStructure.js file. Please provide a complete example, of using this plugin... I really want to use it, but no one seems to show a complete solution with v3.

Thanks in advance.

[harperaa]

Here is my deskStructure.js. please advise if I am missing something to make this work. Thanks again.

// ./src/deskStructure.js import React from 'react' import S from '@sanity/desk-tool/structure-builder' import { SEOPane } from 'sanity-plugin-seo-pane'

// ...all other list items export const getDefaultDocumentNode = () => { return S.document().views([ S.view.form(), S.view .component(SEOPane) .options({ // Retrieve the keywords and synonyms at the given dot-notated strings keywords: seo.keywords, synonyms: seo.synonyms, url: (doc) => resolveProductionUrl(doc),

            // Alternatively, specify functions (may be async) to extract values
            // keywords: doc => doc.seo?.keywords,
            // synonyms: async(doc) => client.fetch('some query to get synonyms', {id: doc._id}),
            // url: async(doc) => client.fetch('some query to construct a url with refs', {id: doc._id})
        })
        .title('SEO')
])

}

[SimeonGriggs]

It looks like you have installed the Studio v2 version of the plugin. Install this new Beta with:

npm install sanity-plugin-seo-pane@2.0.0-beta.1

Here’s the latest Next.js with embedded Studio starter, with the new SEO Pane plugin installed and configured: https://github.com/SimeonGriggs/showcase-seo-pane