锂离子电容

Preparing your mobile app for an emulator can seem like an overwhelming task at first. However, once the specifics are laid out, it’s actually a fairly painless process and an exciting time for any developer. With Android Studio being OS independent, it’s not only a great starting point for us to begin, but also just as useful for seasoned mobile app developers as well.

首先，为模拟器准备移动应用程序似乎是一项艰巨的任务。 但是，一旦详细说明了细节，对于任何开发人员来说，这实际上都是一个相当轻松的过程，也是一个令人兴奋的时刻。 Android Studio独立于操作系统，这不仅是我们开始的一个很好的起点，而且对经验丰富的移动应用程序开发人员也同样有用。

For the example in this post, we’ll be making use of React for our Ionic app, but this would work just as well using Angular.

对于本文中的示例，我们将在我的Ionic应用程序中使用React，但是使用Angular也可以很好地工作。

离子和电容器入门 (Getting Started with Ionic and Capacitor)

To begin, we’ll assume the Ionic CLI is installed, and let’s create a sample app.

首先，我们假定已安装Ionic CLI，然后创建一个示例应用程序。

$ ionic start ionic-cra blank --type=react --capacitor

Now if you’ve already created an app, or began coding, there’s nothing to worry about. Let’s move onto our next step, which is initializing Ionic and Capacitor.

现在，如果您已经创建了一个应用程序，或者已经开始编写代码，则无需担心。 让我们继续下一步，即初始化Ionic和Capacitor。

---

---

Enter the following command, enter a name for your project, and select @ionic/react as your project type.

输入以下命令，输入项目名称，然后选择@ ionic / react作为项目类型。

$ ionic init

Next, let’s add Capacitor to our app:

接下来，让我们将电容器添加到我们的应用程序中：

$ npm i --save @capacitor/core @capacitor/cli

These next steps are surprisingly fast and will lead us right to Android Studio.

这些后续步骤出奇的快速，将使我们直接进入Android Studio。

$ npx cap init

• App name: Your App (likely your project name),
  应用名称：您的应用(可能是您的项目名称)，
• App package: com.yourapp (domain extension followed by your website’s name)
  应用包：com.yourapp(域名扩展名，后面跟您网站的名称)
• npm client: either is okay (for mobile apps I use npm to be safe).
  npm客户端：都可以(对于移动应用程序，我使用npm是安全的)。

---

---

Now, edit capacitor.config.json and change the webDir value from www to build. Finally, let’s build and copy of our project to an Android-friendly environment.

现在，编辑capacitor.config.json webDir值从www更改为build 。 最后，让我们构建项目并将其复制到Android友好的环境中。

$ ionic build$ npx cap copy$ npx cap add android

Android Studio (Android Studio)

Open Android Studio to the android folder we’ve created in the root directory of your project during the previous steps.

在前面的步骤中，将Android Studio打开到我们在项目根目录中创建的android文件夹。

Once the project has fully synced, you may need to setup your virtual device. If needed, press “Ctrl + Shift + A” and search for AVD Manager to get started.

项目完全同步后，您可能需要设置虚拟设备。 如果需要，请按“ Ctrl + Shift + A”并搜索AVD Manager以开始使用。

---

---

Hopefully, you’ve made it this far and are ready to run your project by selecting the run drop down in your toolbar and, you guessed it, select run 'app'.

希望您已经做到了这一点，并且可以通过选择工具栏中的run下拉菜单来运行项目，并且您猜到了，选择run 'app' 。

Now if you receive the following error while using Ubuntu/Linux, no worries.

现在，如果在使用Ubuntu / Linux时收到以下错误，则无需担心。

Grant current user access to /dev/kvm

授予当前用户对/ dev / kvm的访问权限

Simply edit permissions for /dev/kvm by opening terminal and entering this next command:

只需打开终端并输入以下命令，即可编辑/dev/kvm的权限：

$ sudo chmod 777 /dev/kvm

Problem solved.

问题解决了。

And there you have it.

那里有。

感谢您的阅读，下次见！ ⏰ (Thanks for reading and see you next time! ⏰)

翻译自:

锂离子电容