기존 Cordova 및 하이브리드 애플리케이션 마이그레이션

개요

IBM MobileFirst Foundation 버전 6.2.0 이상으로 작성된 기존 Cordova 또는 하이브리드 애플리케이션을 마이그레이션하려면 현재 버전의 플러그인을 사용하는 Cordova 프로젝트를 작성해야 합니다. 그런 다음 v8.0에서 중단되거나 중단되지 않은 클라이언트 측 API를 대체하십시오. 마이그레이션 지원 도구를 사용하면 이 태스크를 수행할 수 있습니다.

다음으로 이동

• v8.0으로 개발된 Cordova 앱과 v7.1 이하 버전으로 개발된 Cordova 앱의 비교
• 기존 하이브리드 또는 크로스 플랫폼 앱을 IBM Mobile Foundation 8.0이 지원하는 Cordova 앱으로 마이그레이션
• iOS Cordova의 암호화 마이그레이션
• 직접 업데이트 마이그레이션
• WebView 업그레이드
• 제거된 컴포넌트

v8.0으로 개발된 Cordova 앱과 v7.1 이하 버전으로 개발된 Cordova 앱의 비교

MobileFirst v8.0으로 개발된 Cordova 앱과 IBM MobileFirst Platform Foundation v7.1로 개발된 하이브리드 앱을 비교하십시오.

기존 하이브리드 또는 크로스 플랫폼 앱을 Mobile Foundation 8.0이 지원하는 Cordova 앱으로 마이그레이션

IBM MobileFirst Platform Foundation 버전 6.2 이상으로 개발된 기존 하이브리드 또는 크로스 플랫폼(Cordova) 앱을 Mobile Foundation v8.0에서 지원되는 Cordova 앱으로 마이그레이션할 수 있습니다.

다음 섹션으로 이동

• 마이그레이션 지원 도구로 Cordova 앱 마이그레이션 시작
• MobileFirst 하이브리드 앱의 마이그레이션 완료
• MobileFirst Cordova 앱의 마이그레이션 완료

마이그레이션 지원 도구로 Cordova 앱 마이그레이션 시작

마이그레이션 지원 도구는 더 이상 유효하지 않은 API를 식별하고 v8.0에서 지원되는 Cordova 앱으로 프로젝트를 복사하여 이전 버전의 MobileFirst에서 작성된 크로스 플랫폼 앱의 준비를 도와줍니다.

마이그레이션 지원 도구를 사용하기 전에 다음 정보를 파악하는 것이 중요합니다.

• 기존 IBM MobileFirst Platform Foundation 하이브리드 애플리케이션 또는 mfp cordova create 명령으로 작성한 Cordova 애플리케이션이 있어야 합니다.
• 인터넷에 액세스할 수 있어야 합니다.
• 마이그레이션 지원 도구 mfpmigrate-cli를 설치하려면 node v6.x 및 npm v3.x가 설치되어 있어야 합니다.
• Cordova 명령행 인터페이스(CLI)와 대상 플랫폼에 대해 Cordova CLI를 사용하는 데 필요한 필수 소프트웨어가 설치되어 있어야 합니다. 자세한 정보는 Apache Cordova 웹 사이트에서 The Command-Line Interface를 참조하십시오.
• 마이그레이션 프로세스의 제한사항을 검토하고 숙지하십시오. 자세한 정보는 이전 릴리스에서 앱 마이그레이션을 참조하십시오.

이전 버전의 IBM MobileFirst Platform Foundation 명령으로 작성한 크로스 플랫폼 앱 또는 IBM MobileFirst Platform Foundation 명령으로 작성한 Cordova는 몇 가지를 변경하지 않으면 버전 8.0에서 지원되지 않습니다. 마이그레이션 지원 도구를 사용하면 다음 기능을 간단하게 처리할 수 있습니다.

• 기존 하이브리드 앱 또는 IBM MobileFirst Platform Foundation 앱이 있는 Cordova에서 JavaScript 및 HTML 파일을 스캔하고, 버전 8.0에서 더 이상 사용되지 않거나 더 이상 지원되지 않거나 수정된 API를 식별합니다.
• 내부 하이브리드 앱 또는 IBM MobileFirst Platform Foundation 앱이 있는 Cordova의 구조, 스크립트 및 구성 파일을 버전 8.0에서 지원되는 Cordova 구조에 복사합니다.

마이그레이션 지원 도구는 앱의 주석 또는 개발자 코드를 수정하거나 이동하지 않습니다. 이 도구를 실행한 후 MobileFirst 하이브리드 앱 마이그레이션 완료 또는 MobileFirst Cordova 앱의 마이그레이션 완료로 마이그레이션 프로세스를 계속해야 합니다.

1. 마이그레이션 지원 도구를 설치하십시오.
   • .tgz 파일을 다운로드한 디렉토리로 이동하십시오.
   • 다음 명령을 입력하여 NPM을 사용하여 도구를 설치하십시오.

   npm install -g tgz_filename
   

   mfpmigrate-cli npm 패키지에 대한 세부사항은 여기를 클릭하십시오.

2. 다음 명령을 입력하여 IBM MobileFirst Platform Foundation 앱을 스캔하고 복사하십시오.

   mfpmigrate client --in source_directory --out destination_directory --projectName new-project-directory
   

   • source_directory
     마이그레이션 중인 프로젝트의 현재 위치입니다. 하이브리드 애플리케이션에서 이 위치는 애플리케이션의 application 폴더를 가리켜야 합니다.
   • destination_directory
     새 버전 8.0 호환 가능 Cordova 구조가 출력되는 디렉토리의 선택적 이름입니다. 이 디렉토리는 new-project-directory 폴더의 상위입니다. 이 옵션이 지정되지 않으면 이 폴더는 명령이 실행되는 디렉토리에 작성됩니다.
   • new-project-directory 프로젝트의 새 컨텐츠가 있는 폴더의 선택적 이름입니다. 이 폴더는 destination_directory 폴더 내에 있으며 Cordova 앱에 대한 모든 정보를 포함합니다. 이 옵션이 지정되지 않으면 기본 이름은 app_name-app_id-version입니다.
     클라이언트 명령과 함께 사용되는 경우 마이그레이션 지원 도구는 다음 조치를 완료합니다.
     • 버전 8.0에서 제거되었거나 더 이상 사용되지 않거나 변경된 API를 기존 IBM MobileFirst Platform Foundation 앱에서 식별합니다.
     • 초기 앱의 구조를 기반으로 Cordova 구조를 작성합니다.
     • 적용 가능한 경우 다음 항목을 복사하거나 추가합니다.
       • Android 운영 체제
       • iPhone 및 iPad 운영 체제
       • Windows 운영 체제
       • Cordova-mfp-plugin
       • 이전 프로젝트에 JSONStore 기능이 설치된 경우 Cordova-plugin-mfp-jsonstore 플러그인
       • 이전 프로젝트에 FIPS 기능이 설치된 경우 Cordova-plugin-mfp-fips 플러그인
       • 이전 프로젝트에 푸시 알림 기능이 설치된 경우 Cordova-plugin-mfp-push 플러그인
       • 이전 프로젝트에서 인증서 고정이 사용된 경우 하이브리드 인증서
       • 애플리케이션, 스크립트 및 XML 파일
     • 명령을 완료한 후 기본 브라우저에서 결과 정보 파일을 엽니다.

     중요: 마이그레이션 지원 도구는 개발자 코드 또는 주석 텍스트를 새 구조로 복사하지 않습니다.

3. 새 Cordova 앱에서 API 문제를 해결하십시오.
   • 명령이 완료될 때 destination_directory 디렉토리에 작성되고 기본 브라우저에 열린 api-report.html 파일을 검토하십시오. 이 파일에서 테이블의 각 행은 앱에서 사용되지만 버전 8.0과 호환 불가능한 더 이상 사용되지 않거나 변경되거나 제거된 API를 식별합니다. 이 파일에는 사용 가능한 경우 제거된 API의 대체 API도 지정됩니다.

   파일 경로	행 번호	API	행 컨텐츠	API 변경 카테고리	설명 및 조치 항목
   c:\local\Cordova\www\js\index.js	15	WL.Client.getAppProperty	document.getElementById('app_version') textContent = WL.Client.getAppProperty("APP_VERSION");	지원되지 않음	8.0에서 제거되었습니다. Cordova 플러그인을 사용하여 앱 버전을 가져오십시오. 대체 API가 없습니다.

   • api-report.html 파일에서 식별된 API 문제를 해결하십시오.
4. 초기 앱 구조에서 새 Cordova 구조의 올바른 위치로 개발자 코드를 수동으로 복사하십시오. 소스 IBM MobileFirst Platform Foundation 앱의 유형에 따라 다음 디렉토리의 컨텐츠를 복사하십시오.
   • IBM MobileFirst Platform Foundation 하이브리드 앱
     소스 앱의 common 디렉토리에 있는 컨텐츠를 새 Cordova 앱의 www 디렉토리에 복사하십시오.
   • IBM MobileFirst Platform Foundation 앱이 있는 Cordova 소스 앱의 www 디렉토리에 있는 컨텐츠를 새 Cordova 앱의 www 디렉토리에 복사하십시오.
5. 새 앱에서 scan 명령으로 마이그레이션 지원 도구를 실행하여 API 변경이 완료되었는지 확인하십시오.

   • 다음 명령을 입력하여 스캔을 실행하십시오.

     mfpmigrate scan --in source_directory --out destination_directory --type hybrid
     

     • source_directory
       스캔할 파일의 현재 위치입니다. IBM MobileFirst Platform Foundation 하이브리드 앱에서 이 위치는 앱의 common 디렉토리입니다. Mobile Foundation 버전 8.0 Cordova 크로스 플랫폼 앱에서 이 위치는 www 디렉토리입니다.
     • destination_directory
       스캔 결과가 출력되는 디렉토리입니다.
     • scan_type
       스캔할 프로젝트 유형입니다.

   • api-report.html 파일에서 식별된 나머지 API 문제를 해결하십시오.

6. 6단계를 반복하여 모든 문제가 해결될 때까지 새 Cordova 앱에 대해 스캔 도구를 실행하십시오.

MobileFirst 하이브리드 앱의 마이그레이션 완료

마이그레이션 지원 도구를 사용한 후 코드의 일부를 수동으로 수정하여 마이그레이션 프로세스를 완료해야 합니다.

• 기존 하이브리드 앱에 대해 이미 mfpmigrate 마이그레이션 지원 도구를 실행했을 것입니다. 자세한 정보는 마이그레이션 지원 도구로 Cordova 앱 마이그레이션 시작을 참조하십시오.
• 추가 Cordova 플러그인을 설치해야 하는 경우, Cordova CLI(Command-Line Interface) 및 대상 플랫폼에 대해 Cordova CLI를 사용하는 데 필요한 필수 소프트웨어가 설치되어 있어야 합니다. (6단계 참조) 자세한 정보는 Apache Cordova 웹 사이트에서 The Command-Line Interface를 참조하십시오.
• 새 버전의 JQuery를 다운로드(1c단계)해야 하거나 추가 Cordova 플러그인을 설치(6단계)해야 하는 경우, 인터넷 액세스 권한이 있어야 합니다.
• 추가 Cordova 플러그인을 설치(6단계)해야 하는 경우, node.js 버전 4.0.0 이상이 설치되어 있어야 합니다.

이 태스크의 단계를 완료하여 IBM MobileFirst Platform Foundation 7.1에서 Mobile Foundation 8.0에 대한 지원을 포함하는 Cordova 애플리케이션으로의 MobileFirst 하이브리드 애플리케이션 마이그레이션을 완료하십시오.

마이그레이션을 완료한 후 앱은 IBM MobileFirst Platform Foundation과 별도로 얻은 Cordova 플랫폼 및 플러그인을 사용할 수 있으며, 선호하는 Cordova 개발 도구를 사용하여 앱을 계속 개발할 수 있습니다.

1. www/index.html 파일을 업데이트하십시오.

   • 다음 CSS 코드를 index.html 파일의 헤드 부분에서 이미 존재하는 CSS 코드 앞에 추가하십시오.

     <link rel="stylesheet" href="worklight/worklight.css">
     <link rel="stylesheet" href="css/main.css">
     

     참고: worklight.css 파일은 body 속성을 relative로 설정합니다. 이 항목이 앱의 스타일에 영향을 미치는 경우 사용자의 CSS 코드에서 해당 위치에 대해 다른 값을 선언하십시오. 예:

     body {
           position: absolute;
     }
     

   • 파일 헤드에서 CSS 정의 다음에 Cordova JavaScript를 추가하십시오.

     <script type="text/javascript" src="cordova.js"></script>
     

   • 다음 코드 행이 있는 경우 제거하십시오.

     <script>window.$ = window.jQuery = WLJQ;</script>
     

     사용자 고유 버전의 JQuery를 다운로드하여 다음 코드 행에 표시된 것처럼 로드할 수 있습니다.

     <script src="lib/jquery.min.js"></script>
     

     선택적 jQuery 추가 내용을 lib 폴더로 이동할 필요는 없습니다. 원하는 위치로 이 추가 내용을 이동할 수 있지만 index.html 파일에서 올바르게 참조해야 합니다.

2. WL.Client.init를 자동으로 호출하도록 www/js/InitOptions.js 파일을 업데이트하십시오.

   • InitOptions.js에서 다음 코드를 제거하십시오.

     WL.Client.init 함수는 글로벌 변수 wlInitOptions를 사용하여 자동으로 호출됩니다.

     if (window.addEventListener) {
           window.addEventListener('load', function() { WL.Client.init(wlInitOptions); }, false);
     } else if (window.attachEvent) {
           window.attachEvent('onload',  function() { WL.Client.init(wlInitOptions); });
     }
     

3. 선택사항: WL.Client.init를 수동으로 호출하도록 www/InitOptions.js를 업데이트하십시오.
   • config.xml 파일을 편집하고 <mfp:clientCustomInit> 요소의 enabled 속성을 true로 설정하십시오.

   • MobileFirst 하이브리드 기본 템플리트를 사용 중인 경우 다음 코드를 찾으십시오.

     if (window.addEventListener) {
           window.addEventListener('load', function() { WL.Client.init(wlInitOptions); }, false);
     } else if (window.attachEvent) {
           window.attachEvent('onload',  function() { WL.Client.init(wlInitOptions); });
     }
     

     그런 다음, 다음 코드로 대체하십시오.

     if (document.addEventListener) {
           document.addEventListener('mfpready', function() { WL.Client.init(wlInitOptions); }, false);
     } else if (window.attachEvent) {
           document.attachEvent('mfpready',  function() { WL.Client.init(wlInitOptions); });
     }
     

4. 선택사항: 하이브리드 환경(예: app/iphone/js/main.js)에 특정한 로직이 있는 경우, wlEnvInit() 함수를 복사하여 www/main.js의 마지막에 추가하십시오.

   // This wlEnvInit method is invoked automatically by MobileFirst runtime after successful initialization.
   function wlEnvInit() {
        wlCommonInit();
        if (cordova.platformId === "ios") {
            // Environment initialization code goes here for ios
        } else if (cordova.platformId === "android") {
            // Environment initialization code goes here for android
        }
   }
   

5. 선택사항: 원래 애플리케이션이 FIPS 기능을 사용하는 경우, JQuery 이벤트 리스너를 WL/FIPS/READY 이벤트를 청취하는 JavaScript 이벤트 리스너로 변경하십시오. FIPS에 대한 자세한 정보는 FIPS 140-2 지원을 참조하십시오.
6. 선택사항: 원래 애플리케이션이 마이그레이션 지원 도구로 대체되지 않거나 제공되지 않는 서드파티 Cordova 플러그인을 사용하는 경우, cordova plugin add 명령을 사용하여 해당 플러그인을 Cordova 앱에 수동으로 추가하십시오. 도구에 의해 대체되는 플러그인에 대한 정보는 마이그레이션 지원 도구로 Cordova 앱 마이그레이션 시작을 참조하십시오.

MobileFirst Cordova 앱의 마이그레이션 완료

마이그레이션 지원 도구를 사용한 후 코드의 일부를 수동으로 수정하여 마이그레이션 프로세스를 완료해야 합니다.

• 기존 Cordova 앱에 대해 이미 mfpmigrate 마이그레이션 지원 도구를 실행했을 것입니다. 자세한 정보는 마이그레이션 지원 도구로 Cordova 앱 마이그레이션 시작을 참조하십시오.
• Cordova 명령행 인터페이스(CLI)와 대상 플랫폼에 대해 Cordova CLI를 사용하는 데 필요한 필수 소프트웨어가 설치되어 있어야 합니다. 자세한 정보는 Apache Cordova 웹 사이트에서 The Command-Line Interface를 참조하십시오.
• 인터넷에 액세스할 수 있어야 합니다.
• node.js 버전 4.0.0 이상이 설치되어 있어야 합니다.

mfp cordova create로 작성한 Cordova 앱은 IBM MobileFirst Platform Foundation 이전 버전과 함께 제공된 Cordova 플랫폼 및 플러그인 버전을 사용합니다. 마이그레이션을 완료하면 마이그레이션된 앱에서 Mobile Foundation과 별도로 얻은 Cordova 플랫폼 및 플러그인을 사용할 수 있습니다. 이는 Cordova 애플리케이션에 대해 IBM MobileFirs Foundation v8.0과 함께 사용 가능한 유일한 지원 유형입니다.

마이그레이션하려면 마이그레이션 지원 도구를 실행한 후 앱의 기타 사항을 수정하십시오.

1. 선택한 Cordova 개발 도구를 사용하여 원래 애플리케이션에 있었던 MobileFirst 기능을 사용하는 Cordova 플러그인 외의 Cordova 플러그인을 추가하십시오. 예를 들어 Cordova CLI를 사용하여 cordova-plugin-file 및 cordova-plugin-file-transfer 플러그인을 추가하려면 다음을 입력하십시오.

   cordova plugin add cordova-plugin-file cordova-plugin-file-transfer
   

   참고: mfpmigrate 마이그레이션 지원 도구가 MobileFirst 기능을 위한 Cordova 플러그인을 추가했으므로 이를 추가할 필요가 없습니다. 이러한 플러그인에 대한 자세한 정보는 MobileFirst용 Cordova 플러그인을 참조하십시오.

2. 선택사항: 원래 애플리케이션이 FIPS 기능을 사용하는 경우, JQuery 이벤트 리스너를 WL/FIPS/READY 이벤트를 청취하는 JavaScript 이벤트 리스너로 변경하십시오. FIPS에 대한 자세한 정보는 FIPS 140-2 지원을 참조하십시오.
3. 선택사항: 원래 애플리케이션이 마이그레이션 지원 도구로 대체되지 않거나 제공되지 않는 서드파티 Cordova 플러그인을 사용하는 경우, cordova plugin add 명령을 사용하여 해당 플러그인을 Cordova 앱에 수동으로 추가하십시오. 도구에 의해 대체되는 플러그인에 대한 정보는 마이그레이션 지원 도구로 Cordova 앱 마이그레이션 시작을 참조하십시오.
4. 선택사항: (iOS 플랫폼을 포함하는 앱과 OpenSSL을 사용하는 앱만 해당) cordova-plugin-mfp-encrypt-utils 플러그인을 앱에 추가하십시오. cordova-plugin-mfp-encrypt-utils 플러그인은 Cordova 애플리케이션의 암호화를 위해 iOS 플랫폼과 함께 iOS OpenSSL 프레임워크를 제공합니다.

이제 선호하는 Cordova 도구를 사용하여 Cordova 앱을 계속 개발할 수 있지만 MobileFirst 기능도 포함됩니다.

iOS Cordova의 암호화 마이그레이션

iOS 하이브리드 또는 Cordova 애플리케이션이 OpenSSL 암호화를 사용한 경우, 앱을 새 V8.0.0 고유 암호화로 마이그레이션할 수 있습니다. OpenSSL을 계속 사용하려면 추가적인 Cordova 플러그인을 추가해야 합니다.

마이그레이션을 위한 iOS Cordova 암호화 옵션에 대한 자세한 정보는 Cordova 애플리케이션에서 OpenSSL 사용 주제의 마이그레이션 옵션 절을 참조하십시오.

직접 업데이트 마이그레이션

직접 업데이트는 보호된 리소스에 처음 액세스한 후 트리거됩니다. 새 웹 리소스를 배치하기 위한 프로세스는 v8.0에서 변경되었습니다.

이전 버전과 달리, v8.0에서는 애플리케이션이 보안 MobileFirst 리소스에 액세스하지 않는 경우 클라이언트 애플리케이션은 서버에서 업데이트가 사용 가능한 경우에도 업데이트를 수신하지 않습니다. 예를 들어, @OAuth(security=false) 어노테이션 또는 구성에 의해 OAuth가 사용 안함으로 설정되어서 리소스가 보호되지 않을 수 있습니다. 다음 방법 중 하나로 이 위험을 임시로 해결할 수 있습니다.

• 액세스 토큰을 명시적으로 얻으십시오. WLAuthorizationManager 클래스에서 obtainAccessToken API를 참조하십시오.
• 보호된 다른 리소스를 호출하십시오. WLResourceRequest 클래스를 참조하십시오.

직접 업데이트를 사용하려면 v8.0부터는 더 이상 .wlapp 파일을 MobileFirst Server로 업로드할 필요가 없습니다. 대신 작은 웹 리소스 아카이브(.zip 파일)를 업로드합니다. 이 아카이브 파일에는 이전 버전에서 광범위하게 사용되던 웹 미리보기 파일이나 스킨이 더 이상 포함되지 않습니다. 이는 더 이상 사용되지 않습니다. 아카이브에는 클라이언트로 전송되는 웹 리소스 및 직접 업데이트 유효성 검증을 위한 체크섬만 포함됩니다.

자세한 정보는 직접 업데이트 문서를 참조하십시오.

WebView 업그레이드

IBM MobileFirs Foundation v8.0 Cordova SDK(JavaScript)는 코드 조정이 필요한 많은 변경사항을 소개했습니다.

수동 마이그레이션 프로세스에는 몇 가지 스테이지가 포함되어 있습니다.

• 새 Cordova 프로젝트 작성
• 필수 웹 리소스 요소를 이전 버전의 코드로 대체
• SDK 변경사항을 충족하도록 JavaScript 코드에 필수 변경사항 작성

많은 MobileFirst API 요소가 v8.0에서 제거되었습니다. 제거된 요소는 JavaScript의 자동 정정을 지원하는 IDE에서 존재하지 않는 항목으로 명확하게 표시됩니다.

다음 표는 제거해야 하는 API 요소와 해당 기능을 대체할 방법에 대한 제한을 나열합니다. 제거된 요소 중 많은 항목이 Cordova 플러그인 또는 HTML 5 요소로 대체할 수 있는 UI 요소입니다. 일부 메소드가 변경되었습니다.

중단된 JavaScript UI 요소

기타 중단된 JavaScript 요소

더 이상 사용되지 않는 JavaScript API

제거된 컴포넌트

MobileFirst Platform Foundation Studio 7.1로 작성한 Cordova 프로젝트에는 적절성 기능을 지원하는 많은 리소스가 포함되었습니다. 그러나 v8.0에서는 순수한 Cordova만 지원되며 MobileFirst API는 더 이상 이러한 기능을 지원하지 않습니다.

스킨

MobileFirst 애플리케이션 스킨은 여러 디바이스 및 형식에 맞게 조정하기 위해 UI를 최적화하는 방법을 제공했지만 v8.0에서는 더 이상 지원되지 않습니다.
Cordova 및 HTML 5에서 제공하는 응답 웹 디자인 메소드를 채택하여 이 유형의 기능을 대체할 것을 권장합니다.

쉘

쉘을 통해 여러 애플리케이션에서 사용되고 공유되는 기능 세트를 개발할 수 있었습니다. 이러한 방식으로 네이티브 환경 관련 경험이 보다 풍부한 개발자가 코어 기능 세트를 제공할 수 있었습니다. 이러한 쉘은 내부 애플리케이션에 번들되고 비즈니스 로직 또는 UI 개발에 관련된 개발자에 의해 사용되었습니다.

이전 하이브리드 앱에서 쉘 및 내부 애플리케이션을 사용한 경우 Cordova 디자인 패턴을 채택하고 쉘 컴포넌트를 애플리케이션 간에 공유될 수 있는 Cordova 플러그인으로 구현할 것을 권장합니다. 개발자는 쉘 코드의 파트를 재사용하고 Cordova 플러그인으로 마이그레이션하는 방법을 찾을 수 있습니다.

예를 들어, 고객의 모든 앱에 공통된 웹 리소스 세트(JavaScript, css files, graphics, html)가 있는 경우 이러한 리소스를 앱의 www 폴더에 복사하는 Cordova 플러그인을 작성할 수 있습니다.

다음은 이러한 리소스가 src/www/acme/ 폴더에 있는 경우입니다.

• src/www/acme/js/acme.js
• src/www/acme/css/acme.css
• src/www/acme/img/acme-logo.png
• src/www/acme/html/banner.html
• src/www/acme/html/footer.html
• plugin.xml

plugin.xml 파일에는 <asset> 태그가 포함되며, 자원 복사를 위한 소스와 대상이 포함됩니다.

<?xml version="1.0" encoding="UTF-8"?>
<plugin
     xmlns="http://apache.org/cordova/ns/plugins/1.0"     
     xmlns:rim="http://www.blackberry.com/ns/widgets"
     xmlns:android="http://schemas.android.com/apk/res/android"
     id="cordova-plugin-acme"
     version="1.0.1">
<name>ACME Company Shell Component</name>
<description>ACME Company Shell Component</description>
<license>MIT</license>
<keywords>cordova,acme,shell,components</keywords>
<issue>https://www.acme.com/support</issue>
<asset src="src/www/acme" target="www/acme"/>
</plugin>

plugin.xml을 Cordova config.xml 파일에 추가하면 asset src에 나열된 리소스가 컴파일 중에 asset target에 복사됩니다.
그런 다음 해당 index.html 파일 또는 해당 앱 내의 모든 위치에서 이러한 리소스를 재사용할 수 있습니다.

<link rel="stylesheet" type="text/css" href="acme/css/acme.css">
<script type="text/javascript" src="acme/js/acme.js"></script>
<div id="banner"></div>
<div id="app"></div>
<div id="footer"></div>
<script type="text/javascript">
    $("#banner").load("acme/html/banner.html");
    $("#footer").load("acme/html/footer.html");
</script>

설정 페이지

설정 페이지는 개발자가 테스트 용도로 런타임에 서버 URL을 변경할 수 있는 MobileFirst 하이브리드 앱에서 사용 가능한 UI입니다. 이제 개발자는 기존 MobileFirst 클라이언트 API를 사용하여 런타임 시 서버 URL을 변경할 수 있습니다. 자세한 정보는 WL.App.setServerUrl을 참조하십시오.

축소

MobileFirst Studio 7.1은 컴파일 전에 불필요한 문자를 모두 제거하여 JavaScript 코드의 크기를 줄이는 OOTB 메소드를 제공했습니다. 프로젝트에 Cordova 후크를 추가하여 이 제거된 기능을 대체할 수 있습니다.

여러 후크를 사용하여 JavaScript 및 CSS 파일을 축소할 수 있습니다. 앱의 config.xml 파일에서 before_prepare 이벤트에 후크를 배치할 수 있습니다.

다음은 일부 권장되는 후크입니다.

• https://www.npmjs.com/package/uglify-js
• https://www.npmjs.com/package/clean-css

이러한 후크는 <hook> 요소를 사용하여 플러그인 파일 또는 앱의 config.xml 파일에서 정의할 수 있습니다.
다음 예제에서는 Cordova가 각 플랫폼의 www/ 폴더에 파일을 복사하기 전에 before_prepare 후크 이벤트를 사용하여 코드를 축소하는 스크립트를 실행합니다.

<hook type="before_prepare" src="scripts/uglify.js" />