Programing

typecript에서 markdown(.md) 파일을 가져오는 방법

c10106 2022. 4. 2. 09:40
반응형

typecript에서 markdown(.md) 파일을 가져오는 방법

형식 설명에 있는 읽기 파일을 가져오려고 하는데 "오류 모듈을 찾을 수 없음"이 표시됨

내 TS 코드

import * as readme from "./README.md"; // here i am getting error module not found

나도 노력했다: typeings.d.ts

declare module "*.md" {
    const value: any;
    export default value;
}

필자는 2.0 https://github.com/Microsoft/TypeScript/wiki/What's-new-in-TypeScript#typescript-20 타이프에서 우리가 어떤 확장자 파일도 포함시킬 수 있도록 "모듈 이름에 와일드카드 문자"를 도입했다는 것을 발견했다.

방금 https://hackernoon.com/import-json-into-typescript-8d465beded79 예제를 따라왔는데, json 파일의 경우 마크다운 파일도 똑같이 따라갔지만 성공하지 못했다.

나는 웹팩과 로더를 사용하지 않아서 그냥 형식만 보고 싶었어.

형식에 대응(React with Typecript)을 사용하는 경우:

루트 디렉터리에 다음 코드를 사용하여 globals.d.ts 파일을 만드십시오.

declare module "*.md";

그런 다음 다음과 같이 가져오기:

import readme from "../README.md" // substitute this path with your README.md file path

각도 8, TypeScript 3.5.2

파일 만들기globals.d.ts폴더 내에 있어야 함) 폴더에src작업), 추가:

declare module '*.md';

다음을 사용하여 구성 요소 또는 서비스 가져오기:

import * as pageMarkdown from 'raw-loader!./page.md';

이 경우page.md내가 가져오던 부품과 같은 수준이었어이 일은 에 효과가 있었다.serve그리고build --prod또한. 다시 시작하십시오.serve실시간 재로드 모드에서 처음 테스트하는 경우.

더 깨끗한 수입 절차가 있다.json- TypeScript 2.9 릴리스 설명서 참조

참고: 파일 이름을 지정할 필요가 없음globals.d.ts, 라고 불릴 수 있었다.anything-at-all.d.ts하지만 그게 관례야

링크된 예제에서 그들은 마크다운이 아닌 JSON을 가져오고 있다.그들은 유효한 JSON 또한 유효한 JavaScript/TypeScript이기 때문에 JSON을 가져올 수 있다.마크다운은 유효한 TypeScript가 아니므로 그렇게 수입하는 것은 박스에서 해결되지 않을 것이다.

런타임에 Markdown 파일에 액세스하려면 AJAX를 요청하여 파일의 내용을 검색하십시오.만약 당신이 정말로 JavaScript 자체 내에서 그것을 만들기를 원한다면, 당신은 일종의 빌드 스크립트를 가질 필요가 있을 것이다.웹 팩을 사용하지 않는다고 하셨지만 모듈 규칙 타이를 추가하면 원하는 것을 얻을 수 있을 겁니다./\.md$/raw-loader같은 종류의 것을 사용해야 할 겁니다

편집:

너는 매일 새로운 것을 배우는 것 같아.OP가 논평에서 지적했듯이, TypeScript 2.0은 비코드 리소스 가져오기를 지원한다.

다음을 시도해 보십시오.

declare module "*!txt" {
    const content: string;
    export default content;
}

import readme from "./README.md!txt";

readme그런 다음 값은 README.md의 내용을 포함하는 문자열이어야 한다.

@미치의 대답이 나에게는 통하지 않았다.각도 v7을 사용하여 다음과 같은 구문을 사용할 수 있음을 알았다.import * as documentation from 'raw-loader!./documentation.md';

형식에 대응(React with Typecript)을 사용하는 경우:

의 파일을 찾아내다src/react-app-env.d.ts다음 코드를 사용하여 파일링하십시오.

declare module "*.md";

그런 다음 다음과 같이 가져오기:

import readme from "../README.md" // substitute this path with your README.md 

참조URL: https://stackoverflow.com/questions/44678315/how-to-import-markdown-md-file-in-typescript

반응형