首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >TypeError:(0,marked__WEBPACK_IMPORTED_MODULE_7__.default)不是函数

TypeError:(0,marked__WEBPACK_IMPORTED_MODULE_7__.default)不是函数
EN

Stack Overflow用户
提问于 2021-11-29 09:44:17
回答 1查看 1.8K关注 0票数 3

我已经将我的项目从Next.js 10更新到了12。在所有更改中,我的一个部分停止工作,特别是从标记文件生成页面的部分。我一直收到错误:

代码语言:javascript
复制
TypeError: (0 , marked__WEBPACK_IMPORTED_MODULE_7__.default) is not a function

我的Next.js Javascript模板是:

代码语言:javascript
复制
/** @format */
import fs from 'fs';
import path from 'path';
import matter from 'gray-matter';
import Head from 'next/head';
import marked from 'marked';
import { defaultLocale } from '../../i18n.json';
import useTranslation from 'next-translate/useTranslation';

import Header from '../../components/ui/Header/Header';
import Footer from '../../components/ui/Footer/Footer';
import Main from '../../components/ui/Main/Main';

const postsDirectory = path.join(process.cwd(), '__docs');

export default function Doc({ htmlString, data }) {
  let { t } = useTranslation();

  return (
    <>
      <Head>
        <title>
          {data.title} – {t('common:version', { version: data.version })}
        </title>
        <link rel='icon' href='/favicon.png' />
      </Head>

      <Header background='1' elevation='4' />
      <Main css='padding--16 display--grid'>
        <h1>{data.title}</h1>
        <div
          dangerouslySetInnerHTML={{ __html: htmlString }}
          className='color--gray line-height--24'
        />
        <hr />
        <p className='color--gray line-height--24'>
          {t('common:version', { version: data.version })}. Last update:{' '}
          {data.date}
        </p>
      </Main>
      <Footer />
    </>
  );
}

export const getStaticPaths = async ({ locales }) => {
  let paths = [];

  const docs = fs.readdirSync('__docs');
  console.log(docs);

  for (let slug of docs) {
    for (let locale of locales) {
      let fullpath = path.join(
        postsDirectory,
        slug,
        locale === defaultLocale ? 'index.md' : `index.${locale}.md`
      );

      if (!fs.existsSync(fullpath)) {
        continue;
      }

      paths.push({ params: { slug }, locale });
    }
  }

  return {
    paths,
    fallback: false,
  };
};

export const getStaticProps = async ({ params: { slug }, locale }) => {
  // we need to find and read the file
  const filename = locale === defaultLocale ? 'index.md' : `index.${locale}.md`;
  const markdownWithMetadata = fs
    .readFileSync(path.join(postsDirectory, slug + '/' + filename))
    .toString();
  // we parse the content to strip the metadata
  const parsedMarkdown = matter(markdownWithMetadata);
  // we parse the content to convert it to html with marked
  const htmlString = marked(parsedMarkdown.content);
  return {
    props: {
      htmlString,
      data: parsedMarkdown.data,
    },
  };
};

我当前的package.json是这样的:

代码语言:javascript
复制
{
  "name": "Minide",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "dev": "next dev",
    "build": "next build",
    "start": "next start",
    "lint": "next lint"
  },
  "dependencies": {
    "gray-matter": "^4.0.3",
    "marked": "^4.0.5",
    "mdx": "^0.3.1",
    "next": "12.0.4",
    "next-translate": "^1.2.0",
    "path": "^0.12.7",
    "react": "17.0.2",
    "react-dom": "17.0.2",
    "react-number-format": "^4.8.0",
    "remark": "^14.0.2",
    "remark-html": "^15.0.0"
  },
  "devDependencies": {
    "eslint": "7",
    "eslint-config-next": "^12.0.4"
  }
}

我已经更新了React,我也尝试在页面上导入React,但它根本不起作用。Next.js导入默认是react,但在另一个组件中,我必须强制导入,当我从模板上的' React‘使用导入react时,我从MODULE_7转到MODULE_8。

代码语言:javascript
复制
TypeError: (0 , marked__WEBPACK_IMPORTED_MODULE_8__.default) is not a function
EN

回答 1

Stack Overflow用户

发布于 2021-12-01 18:21:36

我也有同样的问题。您错误地导入了marked。正如备注文档中所述,您应该这样做,而不是使用import { marked } from 'marked';

票数 5
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/70152561

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档