Onsen UI Ver.2.11.0より、AngularJS(Ver.1.X)の関連ファイルangular-onsenui.js(angular-onsenui.min.js)が同梱されなくなりました。
以下の文章は、Ver.2.10.10においてコンソールに表示されるメッセージです。
From Onsen UI 2.11.0, the AngularJS binding will no longer be part of the core package. You will need to install the new angularjs-onsenui package. See https://onsen.io/v2/guide/angular1/#migrating-to-angularjs-onsenui-package for more details.
Ver.2.11.0以前のバージョンからアップデートすると、アプリが正常に動作しません。
今回は、Onsen UI Ver.2.11.1でAngularJSを使用する方法について説明します。
下記コードの場合、angular-onsenui.js(angular-onsenui.min.js)が同梱されないので、アプリが正常に動作しません。
1 2 3 4 5 6 7 8 9 10 11 |
<!DOCTYPE HTML> <html ng-app="myApp"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"> <meta http-equiv="Content-Security-Policy" content="default-src * data:; style-src * 'unsafe-inline'; script-src * 'unsafe-inline' 'unsafe-eval'"> <script src="angular/angular.min.js"></script> <script src="onsenui/js/onsenui.min.js"></script> <script src="onsenui/js/angular-onsenui.min.js"></script> <link rel="stylesheet" href="onsenui/css/onsenui.min.css"> <link rel="stylesheet" href="onsenui/css/onsen-css-components.min.css"> |
コンソールに表示されたメッセージ内のURLのページに、別途angularjs-onsenuiパッケージを導入する説明が記載されています。
npmでangularjs-onsenuiパッケージを取得してangularjs-onsenui.jsを確認したところ、Ver.2.10.10のangular-onsenui.jsと同じ内容でした。
※以下のコードは差異のある箇所のみ抜粋。
angularjs-onsenui.js
1 2 3 4 5 6 7 |
/* angularjs-onsenui v1.0.0 - 2018-11-30 */ (function (global, factory) { typeof exports === 'object' && typeof module !== 'undefined' ? factory() : typeof define === 'function' && define.amd ? define(factory) : (factory()); }(this, (function () { 'use strict'; |
angular-onsenui.js
1 2 3 4 5 6 7 8 9 |
console.warn('From Onsen UI 2.11.0, the AngularJS binding will no longer be part of the core package. You will need to install the new angularjs-onsenui package. See https://onsen.io/v2/guide/angular1/#migrating-to-angularjs-onsenui-package for more details.'); /* angularjs-onsenui v1.0.1 - 2019-07-29 */ (function (global, factory) { typeof exports === 'object' && typeof module !== 'undefined' ? factory() : typeof define === 'function' && define.amd ? define(factory) : (factory()); }(this, (function () { 'use strict'; |
ファイル名に「js」が追加され、v1.0.0とv1.0.1の違いはconsole.warn()の有無なので、Onsen UI Ver.2.10.10のangular-onsenui.js(angular-onsenui.min.js)をコピー&ペーストすれば、アプリのコードを書き換える必要がありません。
また、アプリ起動時に毎回console.warn()が実行されるので、コメントで潰せば二度と表示されることはありません。
キングストン 高速USBメモリ 32GB USB3.2(Gen1)/3.1(Gen1)/3.0 キャップレス 最大転送速度 200MB/s DataTraveler Kyson DTKN/32GB 新品価格 |