問題合集 · Angular 與 Cordova

[TOC] # [How to update Ionic cli and libraries](https://www.cnblogs.com/tomkart/p/6991989.html) 1）`npm list outdated` 2）手動修改你項目的 package.json 文件，找對應的版本號 3）`npm update` 重新安裝包就可以了。 ## 更新 cordova ionic ~~~ npm update -g cordova ionic ~~~ 執行完成后可以看到cordova和ionic更新后的版本號：當然最原始的方式 `npm uninstall` ,然后 `npm clean` ，再 `npm install` 也是可以的。 # TypeError: tsDiagnostic.file.getText is not a function u can run ./node_modules/.bin/ngc check what cause the error 所以敲命令： ~~~ ./node_modules/.bin/ngc ~~~ 此時打印出有ERROR的信息，把這些ERROR處理完了，再執行一次打包命令成功。 # Error: ENOENT: no such file or directory AndroidManifest.xml 問題描述：在ionic 項目中出現編譯android 的時候出現 `Cordova failed to install plugin Error: ENOENT: no such file or directory AndroidManifest.xml` 無法編譯android apk 解決方案： ``` cordova platform remove android cordova platform add android@6.4.0 ``` # ERROR TypeError: Cannot read property 'timeStamp' of null https://github.com/ionic-team/ionic/issues/12309#issuecomment-355118279$1 open file `../project/node_modules/ionic-angular/components/infinite-scroll/infinite-scroll.js` then replace this code ~~~ if (this._lastCheck + 32 > ev.timeStamp) { // no need to check less than every XXms return 2; } this._lastCheck = ev.timeStamp; ~~~ with this ~~~ try { if (this._lastCheck + 32 > ev.timeStamp) { // no need to check less than every XXms return 2; } this._lastCheck = ev.timeStamp; } catch (e) { // ev is undefined return 2; } ~~~ Note: you have to start app again `ionic serve`, ionic-app-script wont build on `node_modules` changes # package.json里面依賴包的版本號符號版本號 `x.y.z`：其中z 表示一些小的bugfix, 更改z的號， y表示一些大的版本更改，比如一些API的變化 x表示一些設計的變動及模塊的重構之類的，會升級x版本號在 `package.json` 里面 `dependencies` 依賴包的版本號前面的符號有兩種，一種是`~`，一種是`^`。 `~`的意思是匹配**最近的小版本** 比如 `~1.0.2` 將會匹配所有的 1.0.x 版本，但不匹配 1.1.0 `^`的意思是匹配**最近的一個大版本** 比如` ^1.0.2` 將會匹配所有 1.x.x , 但不包括 2.x.x # 檢查cordova 打包運行環境 ~~~ $ cordova requirements ~~~ # 新版IONIC3 WKWebView 出現跨域請求的問題 https://www.jianshu.com/p/7fb8482acc91 官方對新版IONIC3使用WKWebView的解釋在iOS中，現在有兩個網頁瀏覽器，UIWebView和WKWebView。之前的IONIC版本使用的都是UIWebView。現在都將使用WKWebView。我們堅信WKWebview是任何應用程序的最佳選擇，因為它比舊版的webview（UIWebView）有許多改進。 ## [cordova-plugin-advanced-http](https://ionicframework.com/docs/native/http) 問題1：[Get request with params not working 1.11.1](https://github.com/silkimen/cordova-plugin-advanced-http/issues/97) 問題1： # [__zone_symbol__currentTask Error](https://stackoverflow.com/questions/45905118/zone-symbol-currenttask-error) **Workaround:** To log your underlying error detail, you might try the following: ~~~ JSON.stringify(err, Object.getOwnPropertyNames(err)) ~~~ Though this would not generally be recommended, you could remove the property inserted by Angular if it really bothers you: ~~~ delete error.__zone_symbol__currentTask ~~~ # ionic2點擊事件反應慢點擊元素例如 a標簽 button 是可以及時響應的，要想提高其他元素的點擊的反應速度，加tappable屬性即可 `<div tappable (click)="fast()">反應快點</div>` ## Chrome 調試| safari 跨域 Chrome可以安裝[CORS Toggle](https://chrome.google.com/webstore/detail/dboaklophljenpcjkbbibpkbpbobnbld)。Safari本身自帶該功能,Develop -> Disable Cross Origin Restrictions ~~Nginx代理~~ # ionic2中引入自定義js文件或者引入第三方js文件 http://www.egtch.com ~~~ /// 異步加載js <script async defer type="text/javascript" src="build/bmap.js"></script> // 代碼異步追加 js library （在app.component.ts中異步加載） appendDependencyJavascript() { let jsList = ["build/tripledes.js", "build/mode-ecb.js"]; for(let i = 0; i< jsList.length; i++) { let js = jsList[i]; let s = document.createElement("script"); s.type = "text/javascript"; s.src = js; window.setTimeout(()=>{ document.body.appendChild(s); }, 1000 * (i + 1)); } } ~~~ # ionic img `null` 請求404 # If 'ion-col' is an Angular component , then verify that it is part of this module. 用這個不行：https://www.jianshu.com/p/048f8a6c8952 方法：在需要自定義指令的模塊中，導入指令模塊： ~~~ import {ComponentsModule} from "../../../components/components.module"; ... imports: [ ComponentsModule, ], ~~~~ # 使用 [ion-slides](https://ionicframework.com/docs/api/components/slides/Slides/) 縱向滾動時，內容不滾動直接滾動跳過了，出現問題！查看 [ion-slides 源碼](https://github.com/ionic-team/ionic/tree/master/core/src/components/slides)，繼承了著名的 Swiper 。所以查找swiper相關內容： [swiper 內容超出縱向滾動解決辦法](https://github.com/nolimits4web/Swiper/issues/1467)，作者還寫了一個 [demo](https://jsfiddle.net/8fgphstx/1/)。有時間做成指令最好！ # Cordova error: Requirements check failed for JDK 1.8 or greater — am using java 9 [duplicate] Uninstall jdk 9 and then install jdk 8. Maybe cordova is not able to detect jdk9>jdk1.8 # [ionic2 tabs使用 Modal底部tab彈出框](https://blog.csdn.net/u010564430/article/details/53942389) # [Ignoring local @import of "animate.css" as resource is missing.)](https://www.abeautifulsite.net/importing-plain-css-files-with-sassscss#/) 明明有資源在那里。那么為什么編譯器報告它缺失？我可能永遠不會理解這個設計決策背后的邏輯，但解決方案就是簡單地省略 `.css` 后綴名： ~~~ /* Imports animate.css */ @import 'animate'; ~~~ # Cordova 實現沉浸式（透明）狀態欄效果 [cordova-plugin-statusbar](https://github.com/apache/cordova-plugin-statusbar) https://segmentfault.com/a/1190000009078477 http://blog.csdn.net/u010730897/article/details/74450922 http://online.sfsu.edu/chrism/hexval.html # ionic2中使用自定義圖標 https://www.cnblogs.com/ImaY/p/6955772.html # [ionic2/ionic3打包成App啟動慢，ionic3啟動長時間白屏解決方案](http://bbs.phonegap100.com/thread-4122-1-1.html) ionic2在使用ionic build android 或者 ionic build ios打包生成的App，啟動非常，非常，非常慢！尤其是Android，簡直不能忍！其實官方給出了很簡單的解決方法：使用`--prod --release`參數上面的方法如果不好使可以試試： ~~~ 1.運行ionic build --prod 2.直接用androidstudio運行或者 cordova run android ~~~ # [px轉REM布局實現過程](https://www.jianshu.com/p/ae6555c417ea) # 動畫 https://forum.ionicframework.com/t/solved-fade-page-transition/94573/15 # 白屏 `--prod`參數的作用：解決ionic2生成app后啟動的白屏問題。具體原理請查看 [解決ionic2 生成app啟動白屏的問題](https://www.jianshu.com/p/9af84a4305c0) # xcode-select: error: tool 'xcodebuild' requires Xcode, but ... 參考：https://stackoverflow.com/questions/17980759/xcode-select-active-developer-directory-error # [Ios-deploy install doesn't work - macOS High Sierra (10.13.5)](https://stackoverflow.com/questions/50952245/ios-deploy-install-doesnt-work-macos-high-sierra-10-13-5) ~~~ sudo rm /System/Library/PrivateFrameworks/MobileDevice.framework/XPCServices ~ ~~~ But you need to turn off the `SIP` to be able to do it. # 參考 [ionic3 命令行報錯解決方法大全](https://blog.csdn.net/github_37848145/article/details/78286516)