npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

cordova-plugin-ionic4-crosswalk-webview

v4.2.0

Published

Ionic Crosswalk Web View Engine Plugin

Downloads

19

Readme

前言

该插件的功能是在cordova ionic4项目中使用cordova-plugin-crosswalk-webview浏览器内核。

↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓

目前只支持[email protected]或以下平台,高于[email protected]将出现启动空白情况

介绍

使用了cordova-plugin-crosswalk-webview作为 cordova 浏览器内核,cordova使用file:///协议访问app内置的html页面,但由于angular ionic4中无法兼容file:/// 协议。

因此在ionic4中,ionic官方提供了一个插件cordova-plugin-ionic-webview,将file:///协议替换成了http://协议,以兼容angular框架,但是该插件调用的android系统自带的浏览器,且无法同时兼容cordova-plugin-crosswalk-webview插件。

为了能在ionic4项目中同时使用cordova-plugin-crosswalk-webview,可以安装此插件。

安装

使用前需卸载cordova-plugin-ionic-webviewcordova-plugin-crosswalk-webview

cordova plugin remove cordova-plugin-crosswalk-webview
cordova plugin remove cordova-plugin-ionic-webview

安装插件

android sdk 24 以下,使用crosswalk webview浏览器内核; android sdk 24及以上,使用安卓系统内置的高版本浏览器内核。

cordova plugin add cordova-plugin-ionic4-crosswalk-webview --variable WEBVIEW_ENGINE=AUTO

始终使用CrosswalkWebView内核

cordova plugin add cordova-plugin-ionic4-crosswalk-webview --variable WEBVIEW_ENGINE=CROSSWALK

始终使用SystemWebView内核

cordova plugin add cordova-plugin-ionic4-crosswalk-webview --variable WEBVIEW_ENGINE=SYSTEM

如何使用

在你的cordova启动页面index.html中写以下脚本

<head>
  <script>
    // 在加载cordova.js之前调用
    if (window.location.href.indexOf("file:") == 0){
      window.location.href = "http://localhost";
    }
  </script>
</head>

切换内核

//在下次启动APP时使用CrosswalkWebView内核后
Ionic.WebView.useCrosswalkWebViewAtTheNextStartup();
//在下次启动APP时使用SystemkWebView内核
Ionic.WebView.useSystemWebViewAtTheNextStartup();

如何调试

由于crosswalk编译成了不同架构的apk,因此原来的命令ionic cordova run android --emulator不再适用,请改用以下命令调试apk

ng run app:ionic-cordova-build --platform=android && cordova run android --emulator

可以使用npm封装命令,在package.json

{
  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e",
    "debug": "ng run app:ionic-cordova-build --platform=android && cordova run android --emulator"
  }
}

使用npm命令调试

npm run debug

Demo

你可以参考示例 https://github.com/waitaction/cordova-plugin-ionic4-crosswalk-demo