JavaScript 모듈 및 타사 라이브러리

JavaScript 모듈을 사용하여 코드베이스를 최적화하여 관련 코드를 그룹화하거나 타사 라이브러리를 추가하고 애플리케이션 간에 해당 코드를 재사용합니다.

개요

모듈은 인스턴스의 여러 애플리케이션에서 익스포트되고 재사용되는 관련 코드를 포함하는 JavaScript 파일입니다. SDK를 ServiceNow 사용하여 만들거나 변환한 범위가 지정된 응용 프로그램에서는 에서 JavaScript 모듈 및 타사 라이브러리를 시각적 스튜디오 코드추가할 수 있습니다. SDK로 애플리케이션을 빌드하기 전에 TypeScript를 사용하여 모듈을 만들고 JavaScript로 컴파일할 수도 있습니다.

모듈에서는 export 문과 함께 재사용할 코드를 식별합니다. 외부 모듈 및 스크립트가 모듈 코드에 액세스하려면 응용 프로그램의 package.json 파일에 있는 내보내기 필드에 진입점을 추가합니다. 그런 다음 import 또는 require 문을 사용하여 응용 프로그램의 다른 곳에서 코드를 다시 사용합니다. 애플리케이션은 모듈 코드를 사용하기 위해 다른 애플리케이션 또는 타사 npm(Node Package Manager) 라이브러리에 대한 종속성을 선언해야 합니다.

모듈을 추가하고 로컬 애플리케이션을 인스턴스에 배포하면 모듈이 EcmaScript 모듈 [sys_module] 테이블에 저장됩니다. 모듈이 여러 애플리케이션에서 사용되는 경우 EcmaScript 모듈 [sys_module] 테이블에 여러 레코드가 있습니다.

JavaScript 모듈을 만드는 데 사용되는 구문에 대한 일반적인 내용은 MDN Web Docs 웹 사이트의 JavaScript 모듈 페이지를 참조하십시오. 애플리케이션에서 TypeScript를 사용하려면 을 참조하십시오 SDK와 함께 ServiceNow TypeScript 사용.

제한

• 전역 애플리케이션 및 애플리케이션 사용자 지정은 지원되지 않습니다.
• ECMAScript 기능의 하위 집합은 에 따라 JavaScript 엔진 기능 지원모듈에서 지원됩니다.
• Node.js API는 모듈에서 지원되지 않습니다.
• 웹 API와 관련된 전역 변수는 지원되지 않습니다.
• 임포트 및 익스포트 문은 비즈니스 규칙 또는 스크립트 포함과 같은 스크립트에서 지원되지 않습니다. 모듈에서만 지원됩니다.
• 애플리케이션에 추가된 타사 라이브러리는 API에 액세스하거나 API를 호출 ServiceNow 할 수 없습니다.
• 타사 라이브러리의 CommonJS 모듈은 내보내기를 정의하지 않는 한 지원되지 않습니다. 하위 경로 가져오기는 CommonJS 모듈에서 지원되지 않습니다. 타사 라이브러리의 ECMAScript 모듈이 지원됩니다.
• Global Glide API는 기본적으로 모듈에서 사용할 수 없습니다. @servicenow/glide 패키지에서 가져올 수 있습니다.
• JavaScript 모듈[sys_module]은 플랫폼에서 수정할 수 없습니다. SDK를 사용하여 인스턴스에서 시각적 스튜디오 코드 수정하고 배포해야 합니다.

중요사항:

지원되지 않는 API 또는 ECMAScript 기능과 같은 지원되지 않는 기능에 의존하는 타사 라이브러리는 사용할 수 없습니다.

모듈 익스포트 중

모듈에서 export 문과 함께 재사용할 코드를 식별합니다. 명명된 내보내기 또는 기본 내보내기를 사용할 수 있습니다. 명명된 내보내기는 변수, 상수, 함수 또는 클래스에 사용할 수 있는 반면 기본 내보내기는 함수 또는 클래스에만 사용할 수 있습니다. 다음 예제는 모듈에서 여러 기능(함수 및 변수)에 대한 명명된 내보내기를 추가하는 한 가지 방법입니다.

export { myFunction, myVariable };

서로 다른 애플리케이션의 스크립트와 모듈이 모듈의 코드에 액세스하려면 package.json 파일에 exports 필드를 사용하여 애플리케이션에 대한 엔트리포인트를 정의합니다. 다음 예제는 수학 함수에 대한 "math"라는 응용 프로그램에 대한 것입니다.

표 1. 패키지에서 모듈 코드 내보내기

방법	예
모듈을 가리키는 문자열 값을 제공합니다.	{ "name": "math", "version": "1.0.0", "exports": "./src/main.js" }
"."이 main.js 모듈의 하위 경로인 객체를 사용합니다.	{ "name": "math", "version": "1.0.0", "exports": { ".": "./src/main.js" } }
add.js 및 subtract.js 모듈만 하위 경로 내보내기로 내보냅니다.	{ "name": "math", "version": "1.0.0", "exports": { "./add": "./src/functions/add.js", "./sub": "./src/functions/subtract.js" } }
지정된 경로에서 하위 디렉터리를 포함한 모든 파일을 내보냅니다.	{ "name": "math", "version": "1.0.0", "exports": { "./functions/*": "./src/functions/*" } }
지정된 경로에서 특정 파일 형식의 파일만 내보냅니다.	{ "name": "math", "version": "1.0.0", "exports": { "./functions/*.js": "./src/functions/*.js" } }
특정 파일 형식의 파일을 내보내지만 디렉토리 내의 폴더는 비공개로 유지합니다.	{ "name": "math", "version": "1.0.0", "exports": { "./functions/*.js": "./src/functions/*.js", "./functions/private-functions/*": null } }

모듈 임포트

다시 사용하려는 모듈 코드를 가져오려면 다른 모듈에서 import 문을 사용하거나 서버 측 스크립트에서 require 문을 사용합니다.

다음 예제는 모듈에서 내보낸 기능을 가져올 수 있는 한 가지 방법입니다.

import { feature } from "path/to/module";

다음 예는 스크립트에서 내보낸 기능을 가져올 수 있는 한 가지 방법입니다.

const { feature } = require("path/to/module");

축약을 사용하여 모듈 코드를 가져오려면 응용 프로그램 package.json 파일의 imports 필드에 있는 하위 경로를 사용할 수 있습니다. 예:

{
	"name": "math",
	"version": "1.0.0",
	"exports": {
		"./functions/*.js": "./src/functions/*.js",
		"./functions/private-functions/*": null
	},
	"imports": {
		"#calc": "calculus",
		"#derivative": "calculus/derivative"
	},
	"dependencies": {
		"calculus": "1.0.0"
	}
}

이 예제를 기반으로 수학 응용 프로그램에서 가져올 때마다 derivative.js에 대한 상대 경로를 작성하는 대신 #derivative 축약형을 사용할 수 있습니다. 하위 경로는 imports 필드에서 #calc와 같은 종속성에 대한 약어를 사용하는 데 사용할 수도 있습니다.

import { derivative } from '#derivative';
import * as calculus from '#calc';

종속성 추가

응용 프로그램은 모듈 코드를 사용하기 위해 다른 응용 프로그램 또는 타사 라이브러리에 대한 종속성을 선언해야 합니다. 애플리케이션의 package.json 파일에 모든 종속성에 대한 패키지 이름과 버전을 포함합니다. 예를 들어, "test" 응용 프로그램에서 "math" 응용 프로그램의 모듈을 사용하려면 "math" 패키지를 종속성으로 추가합니다.

{
	"name": "test",
	"version": "1.0.0",
	"dependencies": {
		"math": "1.0.0"
	}
}