while developing an ionic app I used some icons and images.The issue is now my app is not displaying icons properly .got these errors in the console
Failed to load resource: the server responded with a status of 404 (Not Found)----ionicons.woff2
these error exists for 'roboto-medium.ttf','roboto-regular.ttf','ionicons.woff','ionicons.woff','roboto-regular.woff '
localhost:portnumber/build/assets/fonts/roboto-light.ttf 404 (Not Found)
I didn't even use any of the fonts in my app,but why is this affecting in displaying icons
Cordova CLI: 6.5.0
Ionic Framework Version: 2.0.0
Ionic CLI Version: 2.2.1
Ionic App Lib Version: 2.2.0
Ionic App Scripts Version: 1.0.0
ios-deploy version: Not installed
ios-sim version: Not installed
OS: Linux 3.13
Node Version: v7.7.2
Xcode version: Not installed
i have cross checked with my previous copy of the same app,found that the path in main.css file for #font-face is changed to assets/fonts/ionicons.woff2 from ../assets/fonts .I think this is the root cause ,but i tried to change it,after runing the app the changes were not applied.how to resolve this issue.
after a lot of struggling ,i found the solution .That is to make changes in variable.scss file in "theme" folder .chaning the path of a variable $font-path sloved all the issue.$font-path: "../assets/fonts";
There was same issue for me.
due to some modification these files were missed, Ii got resolved by-
$ npm install
server re-start ionic serve --lab
Working great for me.
Hope it will work for you too.
In my case the following was the fix to the error:
Add this mime to your web.config:
<configuration> <system.webServer> <staticContent> ...
<!--
https://stackoverflow.com/questions/28235550/proper-mime-type-for-woff2-fonts
-->
<remove fileExtension=".woff2" />
<mimeMap fileExtension=".woff2" mimeType="font/woff2" />
If you don't need the Roboto fonts, just remove this line #import "roboto" in variables.scss
Related
I am using XAMPP, Window 8.1 , Laravel 5.5 on localhost
I wrote code for broadcasting in laravel using pusher and works fine. As pusher is very costly so, I am planning to move to socket.io
Added below link in master blade.
<script src="{{ asset('socket.io-client/dist/socket.io.js') }}"></script>
Also ran this command in cmd
npm install express ioredis socket.io --save
but this shows me an error below.
If you see the screenshot, the 404 error is for url is
http://localhost:1234/socket.io/?EIO=3&transport=polling&t=M4VVdoo
but my url is
http://localhost:1234/my/learning/public/socket.io/?EIO=3&transport=polling&t=M4VVdoo
Any idea, why this is happening?
I needed to install below packages.
npm install -g laravel-echo-server
then following the step by step instruction as give here
Finally put below code before any js file.
<script src="http://{{ Request::getHost() }}:6001/socket.io/socket.io.js"></script>
http://localhost:1234/my/learning/public/socket.io/?EIO=3&transport=polling&t=M4VVdoo it looks as though your project directiry is not resolving correctly. This can be because of an incorrect .htaccess, mod_rewrite not being enabled, or in the case of nginx, an incorrect try files directive within a server block. I'd double those appropriate configuration and see if the problem persists there after
Reference here
E:\code>ionic start test2 --v2 Creating Ionic app in folder
E:\code\test2 based on tabs project Downloading:
https://github.com/driftyco/ionic2-app-base/archive/master.zip
[=============================] 100% 0.0s Downloading:
https://github.com/driftyco/ionic2-starter- tabs/archive/master.zip
[=============================] 100% 0.0s Installing npm packages...
Adding initial native plugins [=============================] 100%
0.0s
Saving your Ionic app state of platforms and plugins Saved platform
Saved plugins Saved package.json
♬ ♫ ♬ ♫ Your Ionic app is ready to go! ♬ ♫ ♬ ♫
Some helpful tips:
Run your app in the browser (great for initial development): ionic
serve
Run on a device or simulator: ionic run ios[android,browser]
Test and share your app on device with Ionic View:
http://view.ionic.io
Build better Enterprise apps with expert Ionic support:
http://ionic.io/enterprise
New! Add push notifications, live app updates, and more with Ionic
Cloud! https://apps.ionic.io/signup
New to Ionic? Get started here:
http://ionicframework.com/docs/v2/getting- starte d
E:\code\test2>ionic serve Running live reload server:
http://192.168.133.113:35729 Watching: www//, !www/lib//,
!www/**/*.map √ Running dev server: http://192.168.160.113:8100 Ionic
server commands, enter: restart or r to restart the client app from
the root goto or g and a url to have the app navigate to the given
url consolelogs or c to enable/disable console log output
serverlogs or s to enable/disable server log output quit or q to
shutdown the server and exit
ionic $
E:\code\test2>ionic info
Your system information:
Cordova CLI: 6.3.1
Gulp version: CLI version 3.9.1
Gulp local: Local version 3.9.1
Ionic Framework Version: 3.4.0
Ionic CLI Version: 2.1.0
Ionic App Lib Version: 2.1.0-beta.1
OS: Windows 7 SP1
Node Version: v6.11.0
I need your help!
Thanks in advance and sorry for my English
i have same issue created
solution for
plz edit to confing.xml file
<preference name="loadUrlTimeoutValue" value="700000" />
Well, I am new to ionic 2 and build my first app having 2 pages and 2 services which are the very simple and for a news website.
The problem is, first I build my app for android using --release flag the file size was near 4MB and when I deploy on my mobile the load time was 14 - 17 seconds.
Then I search for 2 days to fix this issue and came up with the idea that I should enable production mode in main.ts and build using --prod flag . Now file size is 2.65MB and load time is 8 - 11 seconds which I think too much time for a mobile device. :(
My system information is:
ordova CLI: 6.5.0
Ionic Framework Version: 3.2.0
Ionic CLI Version: 2.2.3
Ionic App Lib Version: 2.2.1
Ionic App Scripts Version: 1.3.7
ios-deploy version: Not installed
ios-sim version: Not installed
OS: Windows 7
Node Version: v6.10.0
Xcode version: Not installed
In my app I simply pulling news from rest server and displaying on my page. Am I doing something wrong or is there any issue with new version of ionic? I also read by some people that ionic 1 speed was good than the latest version.
Note: I run my app on 3 different devices the issue remain the same.
Check your config.xml, and set SplashScreenDelay value to zero
<preference name="SplashScreenDelay" value="0"/>.
For me, below command worked:
ionic cordova build ios --prod --aot --minifyjs --minifycss --optimizejs
You can use your own platform in above command instead of ios.
It decreased app load time in my case.
Please find more details here https://forum.ionicframework.com/t/ionic-app-takes-too-long-to-start/97546
I am currently developing an Ionic2 app.
My app has
- Total 29 Pages
My plugins are
cordova-plugin-compat 1.1.0 "Compat"
cordova-plugin-console 1.0.5 "Console"
cordova-plugin-device 1.1.4 "Device"
cordova-plugin-file 4.3.2 "File"
cordova-plugin-file-transfer 1.6.2 "File Transfer"
cordova-plugin-network-information 1.3.2 "Network Information"
cordova-plugin-splashscreen 4.0.2 "Splashscreen"
cordova-plugin-statusbar 2.2.1 "StatusBar"
cordova-plugin-whitelist 1.3.1 "Whitelist"
cordova-plugin-zip 3.1.0 "cordova-plugin-zip"
cordova-sqlite-storage 2.0.2 "Cordova sqlite storage plugin"
ionic-plugin-keyboard 2.2.1 "Keyboard"
config.xml is almost default set.
I do npm run ionic:build --aot + ionic prepare android --prod --release, after that I create signed apk from android studio.
My app start time is 9-10 seconds.
How can I reduce it.
Please advice.
There is an ongoing discussion on the forums about this painfull issue
For now, the possible steps may help:
Hiding the splashscreen manually and disable autohide
Shrink the code with rollup, make sure to build for production
Adding lazy loading of some elements
Upgrading to newer ionic version 3+ which brings angular4
I am having great difficulty in operating the ServiceWorker with ionic 2.
I start a new project with ionic this:
$ Ionic start pwa-project blank --v2
The default structure created by the ionic me two important folders:
- src
- www
In both there are the files:
- Index.html (where I have to uncomment the call to service-worker)
- Manifest.json (which set up the data from my app)
- Service-worker.js (the my service worker itself)
The logic for developers in ionc is not touching anything in the www folder and only work in the src folder. And I did, ran the $ ionic serve and started to edit my html, service-worker and manifest, all in the src folder. But I noticed that the changes are not reflected on the same files in the www folder.
Restarted the $ ionic serve and nothing happened.
All right, then I proceeded to edit these three files directly in the www folder to Activate from my service-worker.
This time I came across another problem. The service-worker does not run.
The script invokes the service-worker in the index.html file prints to the console the success message "service worker installed" confirming that it was installed, but I wrote some console.log() in my service-worker of events and these events are not fired, and I can not say why.
console.log ( '[SERVICE WORKER] Install');
console.log ( '[SERVICE WORKER] Activate');
console.log ( '[SERVICE WORKER] Fetch');
None of these is displayed on the console, which makes me believe that the service-worker for some reason, is not running.
In Chrome DevTools, Application pane, appears that the service-worker is installed and enabled.
Has anyone experienced this problem? Managed to solve?
PS .: When I create a project in vanilla javascript everything works fine, the service-worker is installed, running and messages are usually displayed on the console, which makes me believe that there is any interference Ionic (v2).
My Ionic info is:
Cordova CLI: 6.3.1
Gulp version: CLI version 3.9.1
Gulp local: Local version 3.9.1
Ionic CLI Version: 2.1.4
Ionic App Lib Version: 2.1.2
OS: Distributor ID: elementary OS Description: elementary OS Freya
Node Version: v5.12.0
Late to the party, but for my current setup, all is working fine:
cli packages: (/home/khophi/Developments/Ionic/KhophiPwa/node_modules)
#ionic/cli-utils : 1.9.2
ionic (Ionic CLI) : 3.9.2
global packages:
Cordova CLI : 7.0.1
local packages:
#ionic/app-scripts : 2.1.3
Cordova Platforms : android 6.2.3 ios 4.4.0
Ionic Framework : ionic-angular 3.6.0
System:
Android SDK Tools : 26.0.2
Node : v7.10.1
npm : 4.2.0
OS : Linux 4.10