1. Cordova 프로젝트 생성

먼저, Cordova 프로젝트를 생성해야 합니다. 다음 명령어를 사용하여 Cordova CLI를 설치합니다.

npm install -g cordova

그리고 프로젝트 폴더를 생성하고 이동합니다.

cordova create myapp com.example.myapp MyApp
cd myapp

2. Parcel 설정

Parcel을 사용하여 Cordova 프로젝트에 번들링할 준비를 합니다. 먼저 Parcel 및 관련 패키지를 설치합니다.

npm install parcel-bundler parcel-plugin-cordova

그리고 프로젝트의 package.json 파일에 Parcel과 Cordova 플러그인을 추가합니다.

{
  "name": "myapp",
  "version": "0.0.1",
  "scripts": {
    "start": "parcel",
    "build": "parcel build"
  },
  "devDependencies": {
    "parcel-bundler": "^1.12.4"
  },
  "cordova": {
    "plugins": {
      "cordova-plugin-camera": {},
      "cordova-plugin-geolocation": {}
    }
  },
  "cordovaPlugins": [
    "cordova-plugin-camera",
    "cordova-plugin-geolocation"
  ],
  "cordovaPlatforms": []
}

3. Parcel 실행

이제 Parcel을 실행하여 앱을 빌드하고 실시간으로 변경사항을 감지할 수 있습니다. 다음 명령어를 사용하여 앱을 실행합니다.

npm start

Parcel은 기본적으로 src/index.html 파일을 열고 앱을 빌드합니다. 필요한 경우 src 폴더를 만들고 해당 폴더에서 작업합니다.

4. Cordova 플러그인 추가

Parcel을 사용하여 Cordova 앱을 번들링할 준비가 되었습니다. 이제 추가적인 플러그인이 필요하다면 Cordova CLI를 사용하여 설치할 수 있습니다. 다음 명령어를 사용하여 플러그인을 설치합니다.

cordova plugin add [플러그인 이름]

프로젝트의 config.xml 파일에서도 추가한 플러그인이 명시되어야 합니다.

<widget ...>
  ...
  <feature name="[플러그인 이름]">
    <param name="android-package" value="[플러그인의 Android 패키지]" />
  </feature>
  ...
</widget>

이제 Parcel을 사용하여 Cordova 프로젝트를 개발하고, 웹 기반의 UI를 구축하고, Cordova 플러그인을 적용할 수 있습니다. Parcel의 강력한 번들링 기능과 Cordova의 네이티브 기능을 함께 사용하여 모바일 앱 개발을 더욱 효율적으로 할 수 있습니다.

더 자세한 내용은 Parcel 및 Cordova의 공식 문서를 참조하시기 바랍니다.

• Parcel 공식 문서
• Cordova 공식 문서