[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)
- PWA 概念
- Immutable
- Angular 基礎概念
- 入門參考
- Angular 更新總結
- Angular 生態系統
- Rx.js
- Ngrx
- CQRS/ES 模式
- Angular 5 詳解
- 測試
- 定義共享模塊
- 懶路由加載
- angular組件
- 雙向綁定及變化檢測
- 樣式
- ionic 3詳解
- ionic3
- ionic 插件
- Ionic 添加動畫
- Ghost-Loading
- 打包發布
- Android上架國內應用市場流程
- 總結
- 文章
- 問題合集
- Cordova
- 插件開發指南
- Android插件開發指南-官網
- IOS插件開發指南-官網
- Hooks 編寫
- 橋接技術
- ===cordova插件收集===
- 相關主題-官網
- 實戰-自定義插件流程
- UI 及 相關資源