위챗 애플릿 미니 프로그램 개발 WeChat 애플릿에 npm 패키지를 로드하는 방법

WeChat 애플릿에 npm 패키지를 로드하는 방법

Mar 13, 2020 am 10:15 AM
npm 미니 프로그램 위챗

이 글은 위챗 미니 프로그램 개발에서 npm 패키지 기능을 활용하는 방법을 소개하는데, 위챗 미니 프로그램 개발 효율성을 크게 높여주는 것이 위챗 미니 프로그램 개발을 배우는 친구들에게 도움이 되길 바랍니다!

WeChat 애플릿에 npm 패키지를 로드하는 방법

WeChat 미니 프로그램에서 npm 패키지를 로드하는 방법

WeChat 미니 프로그램이 처음 출시되었을 때 npm을 지원하지 않았습니다. 이는 많은 프런트엔드 개발자들이 npm에 익숙하기 때문에 WeChat 미니 프로그램에 대한 비판이기도 합니다. npm 생태 환경.

WeChat 미니 프로그램은 버전 2.2.1 이후 npm 패키지 로딩에 대한 지원을 추가하여 미니 프로그램이 npm을 사용하여 타사 패키지를 설치할 수 있도록 지원합니다.

WeChat 미니 프로그램의 기능 업데이트가 최근 업데이트되었으며 매우 강력합니다. 예를 들어, 빠르게 시작하고 경험할 수 있도록 WeChat 미니 프로그램 개발 플랫폼의 새로운 기능인 "클라우드 개발"을 소개했습니다.

추천 학습: 미니 프로그램 개발

미니 프로그램에 npm 패키지 로드

WeChat 미니 프로그램 npm 패키지 로딩에 대해서는 여기에서 공식 문서를 사용합니다. 라이브러리 미니 프로그램 -datepicker, 이 유형의 라이브러리는 그레고리력과 음력 사이의 날짜 선택 기능을 구현하는 데 사용되는 반면 WeChat 애플릿의 공식 구성 요소는 단순히 그레고리력 시간만 선택할 수 있습니다.

WeChat 애플릿에 npm 패키지를 로드하는 방법

터미널에서 WeChat 애플릿의 프로젝트 폴더를 찾아 npm 설치 명령을 통해 설치하세요.

WeChat 애플릿에 npm 패키지를 로드하는 방법

여기서 –production 옵션을 사용하세요. 이렇게 하면 일부 비업무용 npm 패키지의 설치를 줄여 전체 소규모 프로그램 패키지의 크기를 줄일 수 있습니다.

Build npm 패키지

WeChat 미니 프로그램 개발 도구의 "도구" 메뉴에서 "Build npm" 명령을 클릭하면 npm 패키지를 빌드할 수 있습니다. 이 빌드는 npm 패키지를 로드 가능하고 사용 가능한 미니 프로그램으로 빌드할 수 있습니다. 가방.

모든 사람이 npm 패키지 게시에 언급된 다양한 요구 사항을 더 잘 이해할 수 있도록 원칙에 대한 간략한 소개는 다음과 같습니다.

우선 node_modules 디렉터리는 컴파일, 업로드 및 패키징에 관여하지 않으므로 작은 프로그램 npm 패키지를 사용하려는 경우 "npm 구축" 과정을 거친 후 가장 바깥쪽 node_modules와 동일한 수준 디렉터리 아래에 miniprogram_npm 디렉터리가 생성됩니다. 이 디렉터리에는 실제로 npm 패키지인 빌드 및 패키징된 npm 패키지가 저장됩니다. 미니 프로그램에서 사용됩니다.

빌드 및 패키징은 두 가지 유형으로 나뉩니다. 미니 프로그램 npm 패키지는 빌드 파일 생성 디렉터리의 모든 파일을 miniprogram_npm에 직접 복사합니다. 다른 npm 패키지는 js 파일 항목부터 시작하여 종속성 분석 및 패키징 프로세스를 거칩니다. 웹팩과 유사).

npm 패키지를 찾는 프로세스는 npm 패키지에 의존하는 파일이 있는 디렉터리에서 시작하여 사용 가능한 npm 패키지 또는 애플릿의 루트 디렉터리를 찾을 때까지 계층별로 검색합니다.

WeChat 애플릿에 npm 패키지를 로드하는 방법

빌드가 완료되면 프로젝트에서 "npm 모듈 사용"이 선택되었는지 확인해야 합니다.

WeChat 애플릿에 npm 패키지를 로드하는 방법

프로젝트에서 타사 모듈 사용

이전 실제 프로젝트에서는 홈페이지에서 이 npm 모듈이 로드되는 것을 테스트했습니다.

페이지에 날짜 선택기를 배치한 후 프로젝트를 저장하고 컴파일을 완료한 후 버튼을 클릭하면 컴포넌트의 로딩 상태를 확인할 수 있습니다.

WeChat 애플릿에 npm 패키지를 로드하는 방법

더 많은 WeChat 미니 프로그램 개발 튜토리얼을 보려면 PHP 중국어 웹사이트를 주목하세요!

위 내용은 WeChat 애플릿에 npm 패키지를 로드하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.

핫 AI 도구

Undresser.AI Undress

Undresser.AI Undress

사실적인 누드 사진을 만들기 위한 AI 기반 앱

AI Clothes Remover

AI Clothes Remover

사진에서 옷을 제거하는 온라인 AI 도구입니다.

Undress AI Tool

Undress AI Tool

무료로 이미지를 벗다

Clothoff.io

Clothoff.io

AI 옷 제거제

Video Face Swap

Video Face Swap

완전히 무료인 AI 얼굴 교환 도구를 사용하여 모든 비디오의 얼굴을 쉽게 바꾸세요!

뜨거운 도구

메모장++7.3.1

메모장++7.3.1

사용하기 쉬운 무료 코드 편집기

SublimeText3 중국어 버전

SublimeText3 중국어 버전

중국어 버전, 사용하기 매우 쉽습니다.

스튜디오 13.0.1 보내기

스튜디오 13.0.1 보내기

강력한 PHP 통합 개발 환경

드림위버 CS6

드림위버 CS6

시각적 웹 개발 도구

SublimeText3 Mac 버전

SublimeText3 Mac 버전

신 수준의 코드 편집 소프트웨어(SublimeText3)

Ouyi Exchange App 국내 다운로드 자습서 Ouyi Exchange App 국내 다운로드 자습서 Mar 21, 2025 pm 05:42 PM

이 기사는 중국의 Ouyi Okx 앱의 안전한 다운로드에 대한 자세한 안내서를 제공합니다. 국내 앱 스토어의 제한으로 인해 사용자는 OUYI OKX의 공식 웹 사이트를 통해 앱을 다운로드하거나 공식 웹 사이트에서 제공 한 QR 코드를 사용하여 스캔 및 다운로드하는 것이 좋습니다. 다운로드 프로세스 중에 공식 웹 사이트 주소를 확인하고 응용 프로그램 권한을 확인하고 설치 후 보안 스캔을 수행하며 2 요인 확인을 활성화하십시오. 사용하는 동안 현지 법률 및 규정을 따르고, 안전한 네트워크 환경을 사용하고, 계정 보안을 보호하고, 사기에 대해 경계하고, 합리적으로 투자하십시오. 이 기사는 참조 용이며 투자 조언은 자신의 위험에 처해 있습니다.

H5와 미니 프로그램과 앱의 차이점 H5와 미니 프로그램과 앱의 차이점 Apr 06, 2025 am 10:42 AM

H5. 미니 프로그램과 앱의 주요 차이점은 다음과 같습니다. 기술 아키텍처 : H5는 웹 기술을 기반으로하며 미니 프로그램 및 앱은 독립적 인 응용 프로그램입니다. 경험과 기능 : H5는 가볍고 사용하기 쉽고 기능이 제한되어 있습니다. 미니 프로그램은 가벼우 며 상호성이 우수합니다. 앱은 강력하고 부드러운 경험이 있습니다. 호환성 : H5는 크로스 플랫폼 호환성이며 애플릿 및 앱은 플랫폼에 의해 제한됩니다. 개발 비용 : H5는 개발 비용이 낮고 중간 미니 프로그램 및 최고 앱이 있습니다. 적용 가능한 시나리오 : H5는 정보 표시에 적합하고 애플릿은 가벼운 응용 프로그램에 적합하며 앱은 복잡한 기능에 적합합니다.

H5 Page 프로덕션과 WeChat 애플릿의 차이점은 무엇입니까? H5 Page 프로덕션과 WeChat 애플릿의 차이점은 무엇입니까? Apr 05, 2025 pm 11:51 PM

H5는보다 유연하고 사용자 정의 가능하지만 숙련 된 기술이 필요합니다. 미니 프로그램은 신속하게 시작하고 유지 관리가 쉽지만 WeChat 프레임 워크에 의해 제한됩니다.

회사의 보안 소프트웨어가 응용 프로그램과 충돌하는 경우 어떻게해야합니까? Hues Security 소프트웨어 문제를 해결하는 방법 공통 소프트웨어가 열리지 않습니까? 회사의 보안 소프트웨어가 응용 프로그램과 충돌하는 경우 어떻게해야합니까? Hues Security 소프트웨어 문제를 해결하는 방법 공통 소프트웨어가 열리지 않습니까? Apr 01, 2025 pm 10:48 PM

회사 보안 소프트웨어 및 응용 프로그램을위한 호환성 문제 및 문제 해결 방법. 많은 회사들이 인트라넷 보안을 보장하기 위해 보안 소프트웨어를 설치할 것입니다. 그러나 보안 소프트웨어 가끔 ...

회사의 보안 소프트웨어가 응용 프로그램이 실행되지 않습니까? 문제 해결 및 해결 방법은 무엇입니까? 회사의 보안 소프트웨어가 응용 프로그램이 실행되지 않습니까? 문제 해결 및 해결 방법은 무엇입니까? Apr 19, 2025 pm 04:51 PM

일부 애플리케이션이 제대로 작동하지 않는 회사의 보안 소프트웨어에 대한 문제 해결 및 솔루션. 많은 회사들이 내부 네트워크 보안을 보장하기 위해 보안 소프트웨어를 배포 할 것입니다. ...

Enterprise WeChat에서 JS 리소스 캐싱 문제를 해결하는 방법은 무엇입니까? Enterprise WeChat에서 JS 리소스 캐싱 문제를 해결하는 방법은 무엇입니까? Apr 04, 2025 pm 05:06 PM

Enterprise Wechat의 JS 자원 캐싱 문제에 대한 토론. 프로젝트 기능을 업그레이드 할 때, 일부 사용자는 종종 특히 기업에서 성공적으로 업그레이드하지 않는 상황을 발생시킵니다.

H5 및 애플릿을 선택하는 방법 H5 및 애플릿을 선택하는 방법 Apr 06, 2025 am 10:51 AM

H5 및 애플릿의 선택은 요구 사항에 따라 다릅니다. 크로스 플랫폼, 빠른 개발 및 높은 확장 성이있는 응용 프로그램은 H5를 선택하십시오. 기본 경험, 풍부한 기능 및 플랫폼 종속성을 가진 응용 프로그램의 경우 애플릿을 선택하십시오.

Binance 가상 통화 구매 및 판매 방법에 대한 자세한 자습서 Binance 가상 통화 구매 및 판매 방법에 대한 자세한 자습서 Mar 18, 2025 pm 01:36 PM

이 기사는 2025 년에 업데이트 된 Binance Virtual Currency의 구매 및 판매에 대한 간단한 안내서를 제공하며 Binance 플랫폼에서 가상 통화 트랜잭션의 작동 단계를 자세히 설명합니다. 이 안내서는 Fiat 통화 구매 USDT, 기타 통화 (예 : BTC)의 통화 거래 구매 및 시장 거래 및 한도 거래를 포함한 판매 운영을 다룹니다. 또한이 안내서는 구체적으로 Fiat 통화 거래에 대한 지불 보안 및 네트워크 선택과 같은 주요 위험을 상기시켜 사용자가 Binance 거래를 안전하고 효율적으로 수행 할 수 있도록 도와줍니다. 이 기사를 통해 Binance 플랫폼에서 가상 통화를 구매 및 판매하는 기술을 신속하게 마스터하고 거래 위험을 줄일 수 있습니다.

See all articles