quiltmc.org
1.0.0
이불 프로젝트 웹 사이트.
이 사이트는 Astro, MDX 및 i18Next로 구축되었습니다. CloudFlare 페이지에서 호스팅됩니다. Astro에 더 익숙해 지려면 해당 문서를 읽을 수 있습니다.
당신이 붙어 있거나 궁금한 점이 있으면 불화 서버의 #Website 스레드에 참여하십시오.
사용하기 가장 간단한 편집기는 Visual Studio Code (VSCODE)입니다. Astro 및 MDX에 대한 공식 언어 확장 기능이 있기 때문입니다. VSCODE에서 저장소를 열면 권장 확장 기능을 설치하기 위해 오른쪽 하단 코너에 팝업이 표시됩니다. 확장 검색 바에 @recommended 입력하여 권장되는 확장을 찾아보고 원하는 확장을 수동으로 설치할 수도 있습니다.
VSCODE를 사용하지 않으려면 수행하는 작업에 따라 다음 도구의 하위 집합을 지원하는 편집기를 사용할 수 있습니다.
앞에서 언급했듯이 웹 사이트는 TypeScript로 작성된 Astro를 사용하여 구축되므로 개발을 위해 IT를 구축하고 실행하려면 Node.js와 호환 JavaScript 런타임이 필요합니다. 호환되지 않는 모드 나 블로그 게시물과 같은 간단한 기여 만하면 개발 환경을 설정하는 것이 필수적이지 않습니다. 모든 것이 예상대로 작동하도록 풀 요청을 제출할 때 사이트의 미리보기 버전이 구축됩니다.
Node.js는 크로스 플랫폼 JavaScript 런타임입니다. 직접 설치하거나 좋아하는 패키지 관리자가 사용할 수 있습니다.
우리는 pnpm을 node.js 패키지 관리자로 사용합니다. 다음과 같은 방법으로 설치할 수 있습니다.
npm install -g pnpm더 많은 옵션은 PNPM의 문서를 참조하십시오.
프로젝트 내에서 PNPM을 사용하여 필요한 모든 패키지를 설치하십시오.
pnpm i Astro에는 프로젝트 내에서 파일을 변경할 때 자동으로 다시로드하는 개발 서버가 포함되어 있습니다. 시작하려면 pnpm dev 실행하십시오.
> pnpm dev
15:05:32 [types] Generated 1ms
astro v4.15.2 ready in 702 ms
┃ Local http://localhost:4321/
┃ Network use --host to expose
15:05:32 watching for file changes...
Dev 서버는 시작 시간을 줄이기 위해 페이지를 방문 할 때 페이지를 구축하므로 성능은 완전히 구축 된 사이트보다 나쁩니다.
최종 사이트의 전체 사본을 작성하려면 :
pnpm build
사이트는 dist/ Folder에 내장됩니다. 사이트를 구축하는 것은 눈치 채지 않고 아무것도 깨지지 않았는지 확인하는 유용한 방법입니다.
pnpm astro preview 사용하여 빌드 사이트를 미리 볼 수 있지만 대부분의 경우 Dev 서버보다 유일한 장점은 성능입니다.
CloudFlare 페이지 별 기능 (예 : functions/ 디렉토리의 모든 것)을 테스트 해야하는 경우 CloudFlare의 Wrangler Clito를 사용하여 사이트를 미리 볼 수 있습니다.
먼저 Wrangler를 설치하십시오
pnpm install -g wrangler사이트 구축 :
pnpm build Wrangler를 사용하여 출력 된 dist 폴더를 실행하십시오.
wrangler pages dev dist
Astro의 개발자 서버와 달리 Wrangler는 완전히 구축 된 사이트 만 미리 볼 수 있습니다.
저장소가 어떻게 배치되는지에 대한 자세한 설명은 ARCHITECTURE.md 참조하십시오.
다양한 일반적인 유형의 기여를위한 지침.
public/api/v1/incompatible-mods.json 에서 incompatible-mods.json 파일을 열고 목록 하단에 새 항목을 추가하십시오.
항목에는 다음 필드가 있어야합니다.
"ids": - 영향을받는 모드 ID 목록."Name": - 영향을받는 모드의 전체 이름."type": - 비 호환성 유형. 다음 중 하나 일 수 있습니다."GAME" - 바닐라 게임이 충돌하거나 깨집니다."OTHERS" - 하나 이상의 다른 모드를 깨뜨립니다."SELF" - 스스로를 깨뜨린다."WORKAROUND" - 제대로 작동 할 수있는 해결 방법이 있습니다."Status": - 비 호환성이 얼마나 가까워 지는가. 다음 중 하나 일 수 있습니다."BLOCKED" - MOD 저자는이 문제를 알고 있지만 외부 요인에 의해 수정이 차단됩니다."IN_PROGRESS" - MOD 저자는 수정을 구현하고 있습니다."NO_ANSWER" -이 문제는보고되었지만 MOD 저자는 응답하지 않았습니다."ON_HOLD" - MOD 저자는 수정 사항을 구현하거나 해제하기를 기다리고 있습니다."UNKNOWN" -이 문제는 MOD 저자에게보고되지 않았거나 보고서를 찾을 수 없습니다."WONT_FIX" - 문제 가보고되었지만 MoD 저자는이를 수정하기를 거부합니다."tracking": - 비 호환성을 추적하는 보고서에 대한 링크 (예 : GitHub 문제). 모르는 경우 "UNKNOWN" 으로 설정하십시오."notes": (선택 사항) - 다른 메모 (예 : 알려진 해결 방법). src/pages/en/blog 에서 현재 날짜 및 단축 된 제목 버전으로 새 Markdown 파일을 만듭니다. 날짜는 yyyy-mm-dd 형식이어야하며 제목은 소문자이며 2024-03-09-example-post.md ( - )으로 분리되어야합니다.
파일 상단에는 Yaml로 작성된 메타 데이터 인 Front Matter를 추가해야합니다. 블로그 게시물의 전면 문제는 다음과 같습니다.
---
title : " An Example Title " # The full title of the post
date : 2024-09-03 20:00:00 -00:00 # The date, time, and timezone that the post was written, relative to UTC. It is best practice to give the time in UTC and use an offset of -00:00, as shown.
authors : # A list of one or more authors
- Pineapple
layout : /src/layouts/Post.astro # This tells Astro what layout to use for the page, and should always be the same.
--- 짧은 첫 번째 단락을 작성한 다음 두 줄을 삽입하고 <!-- MORE --> , 두 줄을 더 넣습니다. 예를 들어:
A succinct first paragraph.
<!-- MORE -->
More text here.
이것은 홈페이지와 블로그 게시물 목록에있는 짧은 미리보기에 웹 사이트에 포함 할 내용을 알려줍니다. 여기에서 당신은 당신의 마음의 내용에 마크 다운을 계속 쓸 수 있습니다. 코드 블록에서 구문 강조점도 지원됩니다.
Quilt의 개발자 또는 커뮤니티 팀 중 하나 인 경우 웹 사이트 팀 목록 페이지에 카드가있을 수 있습니다. 이 페이지의 카드 내부의 데이터는 src/data/ 의 TeamData.mjs 파일에서 구축되었습니다.
각 팀원은이 파일에 데이터에 대한 데이터가있는 객체를 가지고 있습니다. 귀하가 나열된 페이지의 섹션은 Github에있는 팀을 기반으로합니다.
다음 데이터를 변경하여 카드를 사용자 정의 할 수 있습니다.
name: - 카드 상단의 이름. 그것은 당신이 원하는 것이 될 수 있습니다.discord: - 불화 사용자 이름.github: - Github 사용자 이름입니다. 이것은 Github에있는 팀을 식별하는 데 사용됩니다.avatar: - 이것은 원하는 이미지의 URL입니다. 최상의 결과를 얻으려면 정사각형이며 너무 크지 않아야합니다. 파일을 public/assets/team/images 에 넣어 웹 사이트에서 호스팅하거나 원하는 다른 이미지 URL을 사용할 수 있습니다.description: (선택 사항) - 당신이 누구인지에 대한 문장 또는 작은 단락.links: (선택 사항) - 다양한 웹 페이지 또는 소셜 미디어 프로필에 대한 링크 목록. 각 링크는 다음 객체로 표시됩니다.icon : 링크를 나타내는 아이콘. 아이콘 세트 Coreui 브랜드 ( cib: , 재료 디자인 아이콘 ( mdi: :) 또는 재료 기호 ( material-symbols: :) 중에서 선택할 수 있습니다. 또는 CURSEFORGE ( curseforge ) 및 MODRINTH ( modrinth-small )에 맞춤 아이콘을 사용하십시오. 아이콘 세트에서 아이콘을 사용하는 경우 (사용자 정의와 달리) 아이콘 이름을 아이콘 이름으로 접두사 세트 (예 : cib:youtube 코어 루이 브랜드의 youtube 아이콘을 사용해야합니다.url : 웹 페이지에 대한 링크.systemMembers: (선택 사항) -이 분야는 복수 시스템이 각 구성원을 표시하기위한 것입니다. 몇 가지 가능한 값이 있습니다."---" 회원이 숨겨져있는 복수 시스템으로 보여줄 것입니다.name: 시스템 멤버의 이름.icon: - 회원을위한 아바타. 원하는 URL을 사용 하거나이 사이트에서 public/assets/team/images/<your-system-name>/ 에서 이미지를 호스팅 할 수 있습니다.
