6가지 실용적인 Vue3 관련 생태학(요약 공유)

이 글은 생태와 관련된 실용적인 vue 내용을 정리하고 공유하는데 도움이 될 테니, 모두에게 도움이 되길 바랍니다!

1. Vue 플러그인 라이브러리

Vue 플러그인 라이브러리는 가장 완벽한 최신 Vue 플러그인을 수집하고 다양한 Vue 플러그인의 자세한 사용 방법을 제공합니다. 다운로드 중. (학습 영상 공유: vue 영상 튜토리얼)

공식 주소: https://www.vue365.cn/

vue 플러그인 라이브러리는 웹 및 모바일 애플리케이션용 최신 무료 Vue를 제공하도록 설계되었습니다. 개발자.js 구성 요소 및 플러그인.

2, Pinia

경량 상태 관리 라이브러리인 API 디자인은 Vuex 5의 제안에 더 가깝고, Vue 코어팀이 추천하는 상태 관리 라이브러리이기도 하며 Vue2와 Vue3를 모두 지원합니다.

공식 주소: https://pinia.vuejs.org/

Features

Pinia에는 다음과 같은 기능이 있습니다.

• 직관적이며 구성 요소와 같은 스토어 정의

• 완벽한 Typescript 지원

• 변이 제거, 상태, 게터, 액션만 제거

• actions는 동기 및 비동기 지원

• Vue Devtools는 Pinia를 지원하여 더 나은 개발 경험 제공

• 여러 스토어 구축 가능, 자동 코드 분할 실현 가능 pinia는 많은 이점을 얻을 수 있습니다.

시간 여행 및 더 쉬운 디버깅

핫 모듈 교체

페이지를 다시 로드하지 않고 스토어 수정

개발 중 기존 상태 유지

• • 플러그인: 플러그인을 사용하여 확장 Pinia 기능
  • JS 사용자를 위한 적절한 TypeScript 지원 또는
  자동 완성

• 서버 측 렌더링 지원
  3. Nuxt 모듈

• 우리에 대해 알아보세요 Nuxt 프로젝트를 향상시키는 모듈 목록입니다.

• 공식 주소: https://modules.nuxtjs.org/

• github 주소: https://github.com/nuxt/modules

4, Nuxt 3

서버 측 렌더링(SSR) 애플리케이션을 만드는 데 사용할 수 있는 경량 애플리케이션 프레임워크

• 공식 주소: https://v3.nuxtjs.org/
  중국어 문서: https://www.nuxtjs.org.cn/
vite + vue3 + 구성 api + ts, CLI, DevTools 및 Nuxt Kit의 통합은 이것이 좋은 코드 구성, 매우 높은 개발 효율성, 개발 경험 및 서버를 제공할 수 있는 완전한 범용 개발 프레임워크임을 보여줍니다. 렌더링/정적 웹사이트 생성(SSR/SSG) 기능, 이것이 핵심입니다!

Nuxt 3의 새로운 기능

Nuxt 3의 재구성은 커널을 간소화하고 더 빠르게 하며 더 나은 개발 경험을 제공합니다.

가벼워짐

최신 브라우저를 대상으로 하는 경우 서버 배포 및 클라이언트 측 생산을 최대 75배까지 줄일 수 있습니다.

더 빠르게

nitro로 구동되는 동적 서버 측 코드 분할로 콜드 스타트를 최적화합니다.

Hybrid

이제 증분 정적 생성 및 기타 고급 모드가 가능합니다.

• Suspense
  탐색 전후에 모든 구성 요소에서 데이터를 가져옵니다.

• Composition API
  진정한 재사용성을 위해 Composition API와 Nuxt 3의 컴포저블을 사용하세요.

• Nuxt CLI
  프로젝트와 통합 모듈을 쉽게 구축하는 데 도움이 되는 새로운 제로 종속성 환경입니다.

• Nuxt Devtools
  브라우저에서 효율적으로 작업할 수 있도록 더 많은 정보와 빠른 수정 사항을 제공합니다.

• Nuxt Kit
  TypeScript 및 버전 간 호환을 기반으로 하는 새로운 모듈 개발.

• Webpack 5
  구성이 필요 없는 더 빠른 빌드와 더 작은 빌드 아티팩트.

• Vite
  Vite를 패키저로 활용하여 가볍고 빠른 HMR을 경험해 보세요.

• Vue3
  Vue3은 다음 애플리케이션을 위한 견고한 기반이 될 것입니다.

• TypeScript
  기본 TypeScript 및 ESM으로 구성되어 있어 추가 단계가 없습니다.

• 5.vuepress

• vuepress는 문서 작성에 사용할 수 있는 vue 기반의 정적 웹 사이트 생성기입니다.

  공식 주소: https://v2.vuepress.vuejs.org/zh/

  

  vuepress는 Vuejs에서 공식적으로 제공하는 Vue 기반 정적 웹 사이트 생성기로, Markdown 구문을 기반으로 웹 페이지를 생성합니다. 간단히 말해서, 문서 사이트를 빠르게 구축하기 위한 도구입니다. 간단히 기능을 구성한 후, 각 Markdown 문서를 작성하여 Github에 게시하기만 하면 됩니다.

  기능

  • 기술 문서에 최적화된 내장 마크다운 확장

  • 마크다운 파일에 포함된 Vue 코드 활용 가능

  • Vue 기반 사용자 정의 테마 시스템

  • PWA 지원

  • Google Analytics 통합

  • 기본 테마:

    • 반응형 레이아웃

    • 선택적 홈페이지

    • 간단하고 즉시 사용 가능한 제목 기반 검색 기능

    • 맞춤형 탐색 바와 사이드바

    • 자동으로 생성된 GitHub 링크 및 페이지 편집 링크

  6, VueUse

  강력한 Vue 구성 유틸리티 모음, 컴포지션 API.

  공식 주소 : https://vueuse.org/
  

  github 주소 : https://github.com/vueuse/vueuse

  

  VueUse vue-demi의 강력한 기능으로 동시에 적용 가능 Vue2와 Vue3!

  Vue 3 데모:

  • vite 사용: https://github.com/vueuse/vueuse-vite-starter

  • Webpack 사용: https://github.com/vueuse/vueuse-vue3 -example

  Vue 2 데모: Vue CLI

  • Vue CLI 사용: https://github.com/vueuse/vueuse-vue2-example

  또한 버전에 주의하세요. 라이브러리:

  버전 v6.0부터 vue3에는 vue >= v3.2가 필요합니다. vue2는 @vue/composition-api>@vue/composition >= v1.1

  에 의존해야 합니다. 【권장 관련 비디오 튜토리얼: vuejs 소개 튜토리얼, 웹 프론트 시작하기 -끝】

위 내용은 6가지 실용적인 Vue3 관련 생태학(요약 공유)의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!