연습 - SharePoint 프레임워크 개발 환경 구성
- 15분
이 연습에서는 SharePoint 프레임워크 구성 요소 만들기를 시작하는 데 필요한 모든 것으로 로컬 개발자 환경을 설정합니다.
코드 편집기 설치
코드 파일을 편집하려면 텍스트 편집기가 필요합니다. 텍스트 편집기에서 필요한 요소에 대한 요구 사항은 없습니다.
이 실습의 나머지 부분과 Microsoft에서 찾을 수 있는 대부분의 예제에서는 Visual Studio Code를 사용합니다.
Node.js 설치
SharePoint 프레임워크 프로젝트를 컴파일, 디버깅 및 패키징하는 데 사용되는 도구는 Node.js를 사용하여 빌드됩니다. Node.js는 JavaScript를 브라우저에서 실행하지 않고 로컬에서 실행할 수 있도록 하는 런타임입니다. 따라서 첫 번째 단계는 필요한 도구를 설치하기 전에 런타임인 Node.js를 설치하는 것입니다.
참고
Node.js 두 가지 릴리스에서 사용할 수 있습니다. 장기 지원 릴리스(LTS라고도 함)는 현재 버전에 최신 기능이 포함되어 있는 동안 대부분의 사용자에게 권장되는 가장 안정적인 버전입니다.
Node.js를 설치하기 전에 이전에 설치하지 않았는지 확인해야 합니다. 명령 프롬프트 또는 터미널(개발자 플랫폼에 따라 다름)을 열고 다음 명령을 실행합니다.
node -v
버전 번호가 반환되면 이미 Node.js가 있는 것입니다. 사용할 수 있는 Node.js 버전은 대상으로 지정할 환경에 따라 달라집니다.
SharePoint Server 2016용 프로젝트를 빌드하는 경우 서버 쪽 버전 종속성으로 인해 SharePoint 프레임워크 v1.1.0을 사용해야 합니다. 즉, Node.js v6.x를 설치해야 합니다. SharePoint Server 2016을 사용한 SharePoint 프레임워크 개발에 대한 자세한 내용은 SharePoint Server 2016 기능 팩 2를 사용한 SharePoint 프레임워크 개발 및 기능 팩 2를 사용한 SharePoint Server 2016용 SharePoint 프레임워크 개발을 참조하세요. Yeoman의 종속성 중 하나를 사용하여 버전 관리 문제를 해결하는 방법에 대한 정보입니다.
SharePoint Server 2019 위한 프로젝트를 빌드하는 경우 서버 쪽 버전 종속성 때문에 SharePoint 프레임워크 v1.4.1을 사용해야 합니다. 즉, Node.js v6.x 또는 v8.x를 설치해야 합니다. SharePoint Server 2019 SharePoint 프레임워크 개발에 대한 자세한 내용은 개발자를 위한 SharePoint Server 2019 및 확정 가이드를 사용하여 SharePoint 프레임워크 개발을 참조하세요. SharePoint Server 2019 대한 SharePoint 프레임워크.
23H1 업데이트로 SharePoint Server 구독 버전 위한 프로젝트를 빌드하는 경우 서버 쪽 버전 종속성 때문에 SharePoint 프레임워크 v1.5.1을 사용해야 합니다. 즉, Node.js v6.x 또는 v8.x를 설치해야 합니다. SharePoint 2019를 사용한 SharePoint 프레임워크 개발에 대한 자세한 내용은 개발자를 위한 SharePoint Server 2019 SharePoint 프레임워크 개발 및 개발자를 위한 최종 가이드: SharePoint Server SE용 SharePoint 프레임워크 참조하세요.
SharePoint Online용 프로젝트를 빌드하는 경우 최신 버전의 Node.js v18.x와 현재 v1.20.0인 SharePoint 프레임워크 최신 버전을 설치하는 것이 좋습니다.
대상으로 지정하려는 환경과 호환되는 Node.js 버전이 이미 있는 경우 다음 섹션으로 건너뜁니다.
브라우저를 열고 Node.js Foundation 사이트(https://www.nodejs.org)로 이동합니다.
현재 LTS 버전은 SharePoint 프레임워크 현재 버전과 호환되지 않을 수 있으므로 사이트로 추가로 이동하여 적절한 설치 관리자를 다운로드합니다.
위쪽 메뉴 탐색에서 다운로드를 선택한 다음 페이지 아래쪽으로 스크롤하여 이전 릴리스를 선택합니다.
이전 릴리스 페이지에서 설치하려는 Node.js 버전을 선택합니다.
사용 중인 플랫폼에 적합한 설치 프로그램 또는 이진 파일을 다운로드하세요.
모든 기본 옵션을 수락하고 설치 프로그램을 실행합니다. 그러면 Node.js 및 npm이 설치됩니다. npm은 Node.js 사용하는 패키지 관리자입니다. NET의 NuGet.
중요
이 모듈의 나머지 자료와 이 학습 경로의 다른 모듈에서는 SharePoint Online용 프로젝트를 빌드한다고 가정합니다.
필요한 도구 설치
SharePoint 프레임워크 개발 환경에서는 웹 개발자에게 인기 있는 Node.js 기반 도구 집합을 사용합니다. 이러한 도구는 Node.js를 기반으로 하므로 모든 플랫폼에서 사용할 수 있으며 동일한 방식으로 작동합니다. 여기에는 Windows, macOS 및 Linux가 포함됩니다.
Yeoman 설치
Yeoman은 사용자에게 질문을 던지는 생성기를 실행하는 스캐폴딩 엔진입니다. 이러한 질문에 대한 답변을 기반으로 Yeoman은 생성기에 의해 정의된 폴더와 파일을 생성합니다.
명령 프롬프트/터미널 창을 열고 다음 명령을 실행하여 npm을 사용하여 Yeoman을 전역적으로 설치합니다.
npm install yo --global
Gulp CLI 설치
Gulp는 작업 실행기 유틸리티입니다. .NET 개발자 및 Visual Studio에서 프로젝트를 컴파일하고 솔루션을 패키징하고 디버깅 환경을 시작하는 데 사용하는 도구인 MSBuild와 유사합니다.
Gulp는 컴퓨터에 전역적으로 설치된 Gulp CLI(명령줄 유틸리티)와 각 개별 프로젝트에 포함된 로컬 Gulp 패키지의 두 부분으로 제공됩니다.
SharePoint Framework v1.13.1 릴리스 이전에 Microsoft의 지침은 Gulp를 전역적으로 설치하는 것이었습니다. SharePoint Framework v1.13.1 릴리스 즈음에 해당 지침은 Gulp CLI를 전역적으로 설치하도록 변경되었습니다. 이렇게 하면 Gulp v3를 사용하는 일부 프로젝트와 Gulp v4를 사용하는 다른 프로젝트를 가질 수 있습니다.
중요
이전에 Gulp를 전역적으로 설치했다면 Gulp CLI를 설치하기 전에 제거해야 합니다. gulp 및 gulp-cli 패키지의 차이점을 이해하려면 gulp가 아닌 전역적으로 항상 gulp-cli 설치를 참조하세요.
Gulp를 제거하려면 명령 프롬프트/터미널 창을 열고 다음 명령을 실행합니다.
npm uninstall gulp --global
Gulp CLI를 설치하려면 명령 프롬프트/터미널 창을 열고 다음 명령을 실행합니다.
npm install gulp-cli--global
SharePoint 프레임워크 Yeoman 생성기 설치
Microsoft는 SharePoint 프레임워크 프로젝트를 스캐폴딩하기 위한 Yeoman 생성기를 만들었습니다.
npm을 사용하여 SharePoint 프레임워크 Yeoman 생성기의 최신 버전을 전역적으로 설치하려면 명령 프롬프트/터미널 창을 열고 다음 명령을 실행합니다.
npm install @microsoft/generator-sharepoint --global
npm을 사용하여 전역적으로 SharePoint 프레임워크 Yeoman 생성기의 특정 버전을 설치하려면 명령 프롬프트/터미널 창을 열고 다음 명령을 실행합니다.
npm install @microsoft/generator-sharepoint@[version number] --global
예를 들면 다음과 같습니다.
npm install @microsoft/generator-sharepoint@1.5.1 --global
요약
이 연습에서는 SharePoint 프레임워크 구성 요소 만들기를 시작하는 데 필요한 모든 것으로 로컬 개발자 환경을 설정했습니다.