ionic-sqlite-typeorm-app

Ionic/Angular application demonstrating the use of the

@capacitor-community/sqlite

with the TypeORM ORM

this app uses Capacitor 4

To start building your App using this App, clone this repo to a new directory:

git clone https://github.com/jepiqueau/ionic-sqlite-typeorm-app.git 
cd ionic-sqlite-typeorm-app
git remote rm origin

• then install it

npm install

• if you use the Electron platform

npm run electron:install

• the capacitor config parameters are:

  "appId": "com.jeep.app.ionic.angular.typeorm",
  "appName": "ionic-sqlite-typeorm-app",

• the terser-webpack-plugin has been installed and a custom.webpack.config.js file has been added to be able to use the migration.

 var webpack = require('webpack');
 var TerserPlugin = require('terser-webpack-plugin')

 console.log('The custom config is used');
 module.exports = {
   optimization: {
     minimize: true,
     minimizer: [
       new TerserPlugin({
         terserOptions: {
           keep_classnames: true,
           keep_fnames: true,
         },
       }),
     ],
   },
   plugins: [
       new webpack.NormalModuleReplacementPlugin(/typeorm$/, function (result) {
           result.request = result.request.replace(/typeorm/, "typeorm/browser");
       })
   ],
 };

• the angular.json has been modified

  • replacing

    "architect": {
      "build": {
        "builder": "@angular-devkit/build-angular:browser",
        "options": {
          "outputPath": "www",

  • by

    "architect": {
      "build": {
        "builder": "@angular-builders/custom-webpack:browser",
        "options": {
          "customWebpackConfig": {
            "path": "./custom.webpack.config.js"
          },
          "allowedCommonJsDependencies": [
            "debug",
            "buffer",
            "sha.js"
          ],
          "outputPath": "www",

  • and

    "serve": {
      "builder": "@angular-devkit/build-angular:dev-server",
      "options": {
        "browserTarget": "app:build"
      },

  • by

    "serve": {
      "builder": "@angular-builders/custom-webpack:dev-server",
      "options": {
        "browserTarget": "app:build"
      },

• development

  • angular cli

  npm run start

  • ionic cli

  ionic serve

• production

npm run build:web

npm run build:native
npx cap sync
npx cap copy

npx cap open android

Once Android Studio launches, make sure that you are using

• Gradle JDK version 11
• Android Gradle Plugin Version 7.2.2

and build your app through the standard Android Studio workflow.

npx cap open ios

Once Xcode launches, you can build your app through the standard Xcode workflow.

npm run ionic:android

Once Android Studio launches, make sure that you are using

• Gradle JDK version 11
• Android Gradle Plugin Version 7.2.2

and build your app through the standard Android Studio workflow.

npm run ionic:ios

Once Xcode launches, you can build your app through the standard Xcode workflow.

npm run electron:start

Thanks goes to these wonderful people (emoji key):

This project follows the all-contributors specification. Contributions of any kind welcome!