
Existing member? Log in and continue learning

See if you like it, start the course for free!

Unlock full course by purchasing a membership
Getting Started with Capacitor
Getting Started with Capacitor
This lesson is going to focus on the basics of getting set up with Capacitor, which will include:
- Installation
- Adding native platforms
- Syncing your web code with the native application
- Running native builds
Installing Capacitor
If you’re using Ionic, then your project likely already has Capacitor installed - it’s installed by default when you generate a new Ionic application. However if you are not using Ionic, as long as your application has:
- A
package.json
file - A directory where your built web application is output (e.g. a
dist
, orpublic
, orwww
folder) - An
index.html
file at the root of your built output
Then you can use Capacitor. The general idea here is that we need to be able to install Capacitor, and Capacitor needs to know where to find the built web output that it can copy into the native applications web view.
To install Capacitor, you will need to run the following commands:
npm i @capacitor/corenpm i -D @capacitor/cli
After installing these packages, you can configure Capacitor for your project by running:
npx cap init
If you are using Ionic, and for some reason your Ionic application does not already have Capacitor installed, you can easily install and configure it by running:
ionic integrations enable capacitor
Adding Native Platforms
By default, no native platforms will be added by Capacitor (i.e. no native iOS/Android application will be created within your project). To do this (if you are not using Ionic) you will first need to add the package for the native platform you want to target (or both of them):
Thanks for checking out the preview of this lesson!
You do not have the appropriate membership to view the full lesson. If you would like full access to this module you can view membership options (or log in if you are already have an appropriate membership).