Closed3
typeScriptにてremarkが使えない
const processedContent = await remark()
にて、以下エラー発生。
This expression is not callable.
Type 'typeof import("D:/workspace/next-catch/node_modules/remark/index")' has no call signatures.ts(2349)
posts
import fs from "fs";
import path from "path";
import matter from "gray-matter";
import remark from "remark";
import html from "remark-html";
// const remark = require("/remark/index");
const postsDirectory = path.join(process.cwd(), "posts");
export type blog = {
blogId: string;
title: string;
date: string;
};
/**
* ブログのIdを一件受け取り、本文を返却します.
*
* @param blogId ブログId
* @returns ブログ本文
*/
export const getPostData = async (blogId: string): Promise<blog> => {
const fullPath = path.join(postsDirectory, `${blogId}.md`);
const fileContents = fs.readFileSync(fullPath, "utf8");
// 投稿のメタデータ部分を解析するために gray-matter を使う
const matterResult = matter(fileContents);
const date: string = matterResult.data["date"];
const title: string = matterResult.data["title"];
const processedContent = await remark()
.use(html)
.process(matterResult.content);
const contentHtml = processedContent.toString();
// データを id と組み合わせる
return {
blogId,
date,
title,
};
};
ライブラリ依存関係
package.json
{
"name": "next-catch",
"private": true,
"scripts": {
"dev": "next dev",
"build": "next build",
"start": "next start",
"lint": "next lint"
},
"dependencies": {
"gray-matter": "^4.0.3",
"next": "12.0.8",
"react": "17.0.2",
"react-dom": "17.0.2",
"remark": "^14.0.2",
"remark-html": "^15.0.1"
},
"devDependencies": {
"@types/react": "^17.0.39",
"eslint": "8.7.0",
"eslint-config-next": "12.0.8",
"typescript": "^4.5.5"
}
}
公式見たら、remarkは名前付きimportに変更されていた。
本体見るとdefaultじゃない。
typeScript対応された際にでも型定義が追加されたのかな?
remark/node_modules/index.d.ts
export const remark: import('unified').FrozenProcessor<
import('mdast').Root,
import('mdast').Root,
import('mdast').Root,
string
>
sample.ts
import {reporter} from 'vfile-reporter'
import {remark} from 'remark'
import remarkPresetLintConsistent from 'remark-preset-lint-consistent'
import remarkPresetLintRecommended from 'remark-preset-lint-recommended'
main()
async function main() {
const file = await remark()
.use(remarkPresetLintConsistent)
.use(remarkPresetLintRecommended)
.process('1) Hello, _Jupiter_ and *Neptune*!')
console.error(reporter(file))
}
このスクラップは2022/02/13にクローズされました