오늘, 컴퓨터에 간단한 작은 응용 프로그램을 구축하기 위해 Ionic을 설치하는 방법을 배우겠습니다. 많은 웹 사이트에서 매우 복잡한 설치 방법을 작성합니다. 사실, 방금 이온을 배우기 시작한 초보자, 특히 프로그래밍 경험이 많지 않은 사람들은 무서워할까요? Cordova의 최신 버전을 설치하고 설치하는 데 어떤 종류의 Node.js 환경이 필요한지가 너무 복잡하다고 느낍니다. 실제로는 그렇게 번거 롭을 필요가 없습니다. 프로젝트 작업을 할 때 Ionic을 어떻게 사용하는지 알려 드리겠습니다.
첫 번째 방법 : 직접 소개하십시오
1 단계 : Ionic을 먼저 다운로드하십시오
Ionic의 최신 버전은 http://ionicframework.com/docs/overview/#download에서 다운로드됩니다.
다운로드 후 다음 디렉토리를 포함하여 압축 패키지를 압축 해제하십시오.
코드 사본은 다음과 같습니다.
CSS/ => 스타일 파일
글꼴/ => 글꼴 파일
JS/ => JavaScript 파일
version.json => 버전 업데이트 지침
GitHub에서 다음 리소스 파일을 다운로드 할 수도 있습니다 : https://github.com/driftyco/ionic (릴리스 디렉토리).
2 단계 : 파일을 소개합니다
다음으로, 우리는 위의 디렉토리의 CSS/Ionic.min.css 및 JS/Ionic.bundle.min.js 파일 만 소개하여 이온 응용 프로그램을 생성하기 만하면됩니다.
<ION-HEADER-BAR> <H1> Hello World! </h1> </ision-header-bar> <Ion-Content> <p> 첫 번째 Ionic 앱. </p> </ison-content>
참고 : PhoneGap과 같은 모바일 애플리케이션에서 해당 JS 및 CSS 파일 만 리소스 라이브러리에만 추가하면됩니다.
두 번째 방법 : 명령 줄 설치
먼저 node.js를 설치해야합니다. 그런 다음 명령 줄 도구를 통해 최신 버전의 Cordova 및 Ionic을 설치하십시오. 공식 Android 및 iOS 문서를 참조하여 설치하십시오.
Window 및 Linux에서 명령 줄 도구를 열어 다음 명령을 실행하십시오.
코드 사본은 다음과 같습니다.
$ npm install -g cordova Ionic
Mac 시스템에서 다음 명령을 사용하십시오.
코드 사본은 다음과 같습니다.
Sudo npm install -g cordova Ionic
팁 : iOS는 Mac OS X 및 Xcode 환경에서 설치 및 사용해야합니다.
위의 환경을 설치 한 경우 다음 명령을 실행하여 버전을 업데이트 할 수 있습니다.
코드 사본은 다음과 같습니다.
NPM 업데이트 -G Cordova Ionic
또는
코드 사본은 다음과 같습니다.
Sudo NPM 업데이트 -G Cordova Ionic
응용 프로그램을 만듭니다
Ionic 또는 빈 프로젝트에서 제공 한 기성품 응용 프로그램 템플릿을 사용하여 이온 응용 프로그램을 만듭니다.
코드 사본은 다음과 같습니다.
$ Ionic Start MyApp 탭
방금 만든 이온 프로젝트를 실행하십시오
이온 도구를 사용하여 앱을 만들고 테스트하고 실행하십시오 (또는 Cordova를 통해 직접 생성).
안드로이드 앱 생성 :
코드 사본은 다음과 같습니다.
$ cd myapp
$ Ionic 플랫폼 추가 Android 추가
$ Ionic Build Android
$ Ionic Emulate Android
iOS 앱 생성 :
코드 사본은 다음과 같습니다.
$ cd myapp
$ Ionic Platform 추가 iOS
$ Ionic Build iOS
$ Ionic Emulate iOS