Наранбаатар Жаргал, 2021 оны 3 сарын 15 05:15
In this guide you will learn how to get started with a project on Sanity.io from the command-line interface. It will walk you through installing the necessary tooling, initiating a project, and start the local development server for Sanity Studio. You will also learn how to deploy it on sanity.studio, and how to invite collaborators to the project.
const serializers = {
types: {
code: (props) => (
<HighlightCode language={props.node.language}>
{props.node.code}
</HighlightCode>
),
},
};
export default ({ post }) => {
return (
<Layout>
<Row>
<Col md="12">
{/* <pre>{JSON.stringify(post, null, 2)}</pre> */}
<div className="blog-detail-header">
<p className="lead mb-0">
<img
src={post.publisher.picture}
className="rounded-circle mr-3"
height="50px"
width="50px"
/>
{post.publisher.title}, {post.date}
</p>
<h1 className="font-weight-bold blog-detail-header-title mb-0">
{post.title}
</h1>
<h2 className="blog-detail-header-subtitle mb-3">
{post.subtitle}
</h2>
<img className="img-fluid rounded" src={post.image} alt="" />
</div>
<br />
<BlockContent
blocks={post.content}
serializers={serializers}
imageOptions={{ w: 320, h: 240, fit: "max" }}
/>
</Col>
</Row>
</Layout>
);
};
export const getStaticProps = async ({ params }) => {
const post = await getPostBySlug(params.slug);
return {
props: {
post: post[0],
},
};
};Slug serializer
This will log you in to Sanity, create a project, set up a dataset, and generate the files needed to run the editing environment locally.
Sanity Studio has pretty much all logic and code is contained in NPM packages. This makes it really easy to upgrade to new versions, and to install and ship plugins as self-contained packages.