I've been using Ionic 2 with MS Visual Studio Community 2017 for quite some time now.
In the Visual Studio Market the plugin Ionic 2 Templates for VS can be downloaded and used.
It is as simple as clicking:
New Project > TypeScript > Mobile Apps > Ionic 2 - Blank
However I can not find a template for Ionic 3. ( seems not released yet)
Any idea how to manually add Ionic 3 to Visual Studio?
Thanks!
I'm just getting started so this might be not quite right, but I did the following:
Ensure you have the Cordova workload installed through VS2017 installer.
Create a new project using VS2017 and the Ionic 2 template
Install Ionic latest if you haven't, via the command line:
npm install -g ionic#latest
Create a new Ionic 3 app, via the command line. Use sidemenu or tabs or blank depending on what template you want to use. I see there's a ton more in https://market.ionic.io/starters/ which you can probably use somehow.
ionic start YourNewAppName sidemenu
Copy files from your Ionic 2 project folder into your Ionic 3 project folder:
taco.json
XXXX.jsproj (don't rename just yet)
XXXX.sln (don't rename just yet)
Launch the XXXX.sln in VS2017
VS prompted me to upgrade project file, OK.
VS prompted me to set version of typescript, OK.
Now the .sln file works for editing & running the Ionic 3 project
Future readers of this answer need to understand that the versions referenced below are the latest versions of the packages at the time of this posting. That means, newer versions may be available at the time of reading.
Upgrade your Ionic CLI. At the time of this post, the latest version is 3.9.1.
npm install -g ionic
Upgrade your NPM Ionic package dependencies.
Most likely you'll need 4.x versions of Angular, and the associated Angular npm dependencies (i.e. CORE, COMPILER, FORMS, HTTP, etc). Most likely you'll need 3.x versions of Ionic-Angular, and 4.x versions of Ionic native packages.
The best way to do this, in my mind, is to use the latest version of the Ionic CLI to create a brand new temporary Ionic application. And then examine the NPM packages listed in the package.json file, and manually update your real application's package.json to match. Be cautious and methodical.
For your convienance, I've attached a default package.json dependencies that's created with a brand new Ionic 3 application.
"dependencies": {
"#angular/common": "4.3.5",
"#angular/compiler": "4.3.5",
"#angular/compiler-cli": "4.3.5",
"#angular/core": "4.3.5",
"#angular/forms": "4.3.5",
"#angular/http": "4.3.5",
"#angular/platform-browser": "4.3.5",
"#angular/platform-browser-dynamic": "4.3.5",
"#ionic-native/core": "4.1.0",
"#ionic-native/splash-screen": "4.1.0",
"#ionic-native/status-bar": "4.1.0",
"#ionic/storage": "2.0.1",
"ionic-angular": "3.6.0",
"ionicons": "3.0.0",
"rxjs": "5.4.3",
"sw-toolbox": "3.6.0",
"zone.js": "0.8.16"
},
"devDependencies": {
"#ionic/app-scripts": "2.1.4",
"typescript": "2.3.4"
},
Related
im trying to use the below package to use tailwind css within my django project im using a windows 10 machine
package used to integrate tailwind-css in django
tailwind-css uses npm modules to install and start of which the install worked although the start failed giving me the below error (all steps in the package Readme were followed upto 7 where the error occured)
im trying to figure out whether its an issue nodejs has with windows or not. any help will be appreciated
here's the fix since we are using windows we have to change the qoutes we use so within ./theme/static_src/package.json change "start": "watch 'npm run build-postcss' ./src"
to
"start": "watch \"npm run build-postcss\" ./src"
I need to do some updates to a Cordova app created using Visual Studio 2017 Tools for Apache Cordova (TACO).
The Cordova CLI version listed in the config.xml file is 6.3.1 and the cordova-ios platform version is 4.2.0
When I try to build the project (using a Mac with XCode 8.3.3, I get this error
Build failed with error Remotebuild requires your projects to use
cordova-ios 4.3.0 or greater with XCode 8.3. Please update your
cordova-ios version.
I don't see any updates to TACO in VS2017 or instructions in the Microsoft documentation for Apache Cordova Tools.
Ideally, I'd like to make the most minor version update possible to get my build working with XCode 8.3.3.
I know there is a Cordova version 7.0.1, but I don't want to make that upgrade just yet because I'm under the gun time wise.
I don't see any updates to TACO in VS2017 or instructions in the Microsoft documentation for Apache Cordova Tools.
You can follow below steps to use the latest cordova-ios:
Open config.xml with designer
Toolset->Check the checkbox of Take latest patch(requires internet) on cordova-ios row.
Update:
If you don't see the checkbox in the designer page, you need to change it in the xml. Find the following tag in config.xml:
<engine name="ios" spec="4.2.0" />
and modify it to:
<engine name="ios" spec="~4.2.0" />
Update2:
If the version is still not update to the latest, please try the below steps to fix the issue:
Clear the cordova cache under: Tools->Options->Tools for Apache Cordova->Clear Cordova cache.
Open cmd of your project folder;
Type npm install -g cordova-ios to install globally the cordova-ios(requires node installed as pre-work);
Then cordova platform rm ios;
Type cordova platform add ios;
Run your project again
For iOS, please install iOS#4.3.1. This is the only version i found working with XCode 8.3.3
I had the same error, follow this steps :
1- If not installed yet, install Node
2- Install the latest version of cordova or anyother:
npm install -g cordova
3- Install taco-cli:
npm install -g taco-cli
4- Configure taco-cli :
taco remote add ios
(respond a few question, MAC IP, Port,etc...)
5- in your root project add or edit a file named "taco.json", add inside :
{
"cordova-cli": "7.1.0"
}
Where 7.1.0 correspond to your cordova version (cordova --v)
6- Try to emulate on your MAC:
taco emulate ios
You will maybe have an error about platform. Ignore it
7- Close then open Visual Studio
8- On Visual Studio open the config.xml UI EDITOR and change the toolset name with
Global cordova
9- Build using Visual Studio.
If it doesn't work, please let me know
I don't have the authority to add a comment to the answer above, so adding my updates here:
If the version is still not update to the latest, please try the below steps to fix the issue:
First, modify your project config.xml file using an editor, rather than through the tools. Not sure why it was necessary, but this was the key difference from the above instructions. I also found that 4.3.1 was best. Remove any ~ characters before the version.
Then:
Clear the cordova cache under: Tools->Options->Tools for Apache Cordova->Clear Cordova cache.
Open cmd of your project folder
Type npm install -g cordova-ios to install globally the cordova-ios(requires node installed as pre-work)
Then cordova platform rm ios
Type cordova platform add ios
Run your project again
If the cordova command in steps 4 and 5 doesn't work, add the cordova bin directory to you path. In my case
C:\ProgramData\Microsoft\VisualStudio\MDA\ad0a0856\taco-toolset-6.3.1\node_modules.bin\
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
In my Ionic 2 app (latest beta [quickstart tutorial]) I installed a few additional plugins (e.g. cordova-plugin-geolocation) and platforms (e.g. android)
Plugins were installed via
ionic plugin add cordova-plugin-file --save #this added the plugin to config.xml but not package.json
Platforms instead:
ionic platform add android
cordovaPlugins and cordovaPlatforms are in package.json (as follows) but weren't modified by the 2 command above:
"cordovaPlugins": [
"cordova-plugin-device",
"cordova-plugin-console",
"cordova-plugin-whitelist",
"cordova-plugin-splashscreen",
"cordova-plugin-statusbar",
"ionic-plugin-keyboard"
],
"cordovaPlatforms": []
Now I'm not sure if this is really an issue (if so, I'll open a bug on the official repository) but apparently when running the project on another machine I need to run
ionic state restore
(I found the answer just after posting)
Apparently ionic state save does the trick
I have Calabash installed as a pod in my project. The gem itself is installed using bundler. When I try to run cucumber for my Calabash target, the first features starts but just hangs and the simulator never launches:
$ bundle exec cucumber
Feature: Ensure Login and Oauth Screen Functionality
Scenario: Verify Welcome Page # features/Sign_in.feature:3
More details from my install:
# xcode installation location
$ xcode-select --print-path
/Applications/Xcode.app/Contents/Developer
# xcode version
$ xcodebuild -version
Xcode 5.1.1
Build version 5B1008
# calabash version
$ bundle exec calabash-ios version
0.9.168
# calabash < 0.9.169 or Xamarin IDE users
# start your app manually in the simulator or from Xcode and then launch a console
$ bundle exec calabash-ios console
> server_version
{
"outcome" => "SUCCESS",
"app_id" => "[REDACTED]",
"simulator_device" => "iPhone",
"version" => "0.9.168",
"app_name" => "[REDACTED]",
"iphone_app_emulated_on_ipad" => false,
"4inch" => true,
"git" => {
"remote_origin" => "git#github.com:jmoody/calabash-ios-server.git",
"branch" => "master",
"revision" => "adde106"
},
"app_version" => "2.0.1",
"iOS_version" => "7.1",
"system" => "x86_64",
"simulator" => "iPhone Simulator 463.9.41, iPhone OS 7.1 (iPhone Retina (4-inch)/11D167)"
}
Ok,that means calabash cannot locate the your app.
Try this first,
Comment out the APP_BUNDLE_PATH definition on
YourProject/features/support/01_launch.rb like #APP_BUNDLE_PATH =
"~/..../../myApp-cal.app" so The calabash gem can locate the app
automatically.
Open a console go to the project folder from it. Then enter gem install calabash-cucumber this will install the calabash gem its ok to run again even if you installed it previously there's no harm. Then enter calabash-ios setup in that terminal, this will create a calabash target and add the calabash framework to your iOS project. more details about the setup process is mentioned in here.
Now open the project file in xcode editor (You can see the calabash.framework added to your project's framework group successfully.) select the yourApp-cal target and the simulator you want clean, build and run the yourApp-cal target on your simulator.
Then stop it and come back to that console enter calabash-ios console console will start a ruby console that you can work with the app. now (while simulator is on your screen but your app is backbround on that simulator) type start_test_server_in_background your app must come to foreground. If that works the calabash can find and run your app on simulator.
Remember only if you create an app build on a separate folder using a xcodebuild command or script or something, thats the time to set the APP_BUNDLE_PATH variable.
Chathura's answer worked for one of my colleagues, but a couple of us had to find another solution.
The issue for us occurred after introducing CocoaPods. In Xcode, I opened Organizer and noticed we had a derived data folder for the BP (before Pods) project and another for the workspace with Pods. I deleted the derived data folder for the BP project and then everything worked.
I had re-setup calabash before doing this, so the solution in my case may have been a combination of Chathura's answer and mine.