IntelliJ Angular project throwing TSLINT error for HTML files in WebStorm - intellij-idea

What steps will reproduce the issue?
Create Angular project in IntelliJ via angular-cli (version 1.5)
Open the same project in WebStorm; open any of the HTML files.
It will throw TSLINT error

What Angular and Typescript version do you use? Looks similar to WEB-30045, caused by lack of TypeScript 2.6 support in Angular (https://github.com/angular/angular/issues/20146)
Another related problem is https://github.com/Microsoft/TypeScript/issues/18322

WebStorm TypeScript version should match the one used by Angular. The version of TypeScript used by Angular is set in
package.json
To do so, select
Prefereces... > Languages & Frameworks > TypeScript
and then, from the TypeScript dropdown, select the node_modules TypeScript installation instead of "Bundled".
Click OK and restart WebStorm.

Related

How can I upgrade react-native gradle version

I need help.
I can't upgrade gradle version of my react-native project.
I try a lot of things, downloaded last version of Android Studio & SDK Tools etc.
I changed this file \android\gradle\wrapper\gradle-wrapper.properties, I tried to upgrade using npm install -g react-native-git-upgrade but still I can't upgrade it.
When I react-native eject It's exports
"distributionUrl=https://services.gradle.org/distributions/gradle-2.14.1-all.zip"
Waiting for answers.
In android/build.gradle you have to edit this line
classpath 'com.android.tools.build:gradle:x.y.z'
Change x.y.z with the version you want. Edit it with Android Studio then click Sync now
In {yourProject}\android\gradle\wrapper\gradle-wrapper.properties, update:
distributionUrl=https\://services.gradle.org/distributions/gradle-{your version}.zip
Find your version of gradle with
gradle --version
You may need to install gradle wrapper if you haven't already.
you can go to https://services.gradle.org/distributions/ and check that latest -all.zip version of gradle and update the same in your gradle-wrapper.properties file. When you run your react-native app the next time, your gradle will first get upgraded and then run.
There are two things
Android Gradle Plugin
You can see the version of it in android/build.gradle file and update it using Daniel's answer here
Gradle version
You can see this in android\gradle\wrapper\gradle-wrapper.properties file and update it using the answer mentioned here
To know the difference between them refer following links:
https://developer.android.com/studio/releases/gradle-plugin
difference between android gradle plugin and gradle
Open Android Studio and navigate to File → Project Structure
Then click on the Project option.
then choose the latest version of Gradle. After that click on Ok.
From Gradle's site:
https://gradle.org/install/#with-the-gradle-wrapper
Upgrade with the Gradle Wrapper If your existing Gradle-based build
uses the Gradle Wrapper, you can easily upgrade by running the wrapper
task, specifying the desired Gradle version:
$ ./gradlew wrapper --gradle-version=6.6.1 --distribution-type=bin
Note that it is not necessary for Gradle to be installed to use the
Gradle wrapper. The next invocation of gradlew or gradlew.bat will
download and cache the specified version of Gradle.
$ ./gradlew tasks
Downloading https://services.gradle.org/distributions/gradle-6.6.1-bin.zip ...
Run these commands in your project's android folder
I had opened my project in Terminal and ran open -a /Applications/Android\ Studio.app to open Android Studio but so that it can access node to download my gradle version which it did automatically.
Learned from this original post: React Native on Android: Cannot run program "node": error=2, No such file or directory
For react native
Go to File -> Project Structure -> Change gradle version to 6.1.1 plugin version to 4.0.0
Try different combinations
Use this link - https://developer.android.com/studio/releases/gradle-plugin.html#updating-gradle

How do I get WebdriverIO autocomplete on VS Code

Is there a way I can get autocomplete on VS Code for webdriverio?
Other code editors like Intellij provide something like Settings -> Preferences -> Languages & Frameworks -> JavaScript -> Libraries
From there we can add a directory with webdriverio commands
How can I do similar thing with VS Code?
my understanding is, vscode is built with typescript and by default it does not support autoComplete(Intellisense) on a package that is built with javascript. So all the js package creators would provide an #types file. These #types file help vscode to find all the function definitions, object properties. etc., etc., of your JS package and show as suggestions. Which in case here is webdriverio package.
So adding a #types dependency that is related to your JS package will mostly fix the issue.
i.e.,
npm install #types/webdriverio --save-dev
After adding the package, i started getting the browser object suggestions.
All the above works fine for v4 version of WDIO.
If you are using v5 version: Then as per their official documentation we need to create a jsconfig.json file on the root directory.
Above answer worked well :
you need to install below dependency :
if you are using webdriverio v4 (for cucumber BDD ) use below
npm install #types/webdriverio#4 --save-dev
or use :
npm install #types/webdriverio --save-dev
VSCode Intellisense
Using #types/webdriverio is not suggested by webdriverio and it is now deprecated:
npm WARN deprecated #types/webdriverio#5.0.0: This is a stub types definition. webdriverio provides its own type definitions, so you do not need this installed.
I would suggest to follow the official documentation by WebDriverIO here:

Unresolved functions or methods using CodeceptJS in PhpStorm

I've just followed the CodeceptJS Quickstart and opened first_test.js in the PhpStorm IDE (equivalent to WebStorm, IntelliJ, etc.).
For all the built-in functions, I'm getting "Unresolved function or method …":
I also don't get any autocompletion on I.
I've tried the following.
Looked for a CodeceptJS plugin. Didn't find any.
Enabled codeceptjs/node_modules in Settings -> Languages & Frameworks -> JavaScript -> Libraries.
Set JavaScript language version to ECMAScript 6.
Enabled the Node.js Core library.
Restarted PhpStorm.
Please run 'npm install codeceptjs'.
I had to follow the steps outlined in https://codecept.io/typescript/ to fully enable CodeceptJS in PHPStorm.
Steps
npm install codeceptjs typescript ts-node
Add require('ts-node/register') as first line in my codecept.conf.js file
Create a tsconfig.json in my project root folder
Run npx codeceptjs def to create the default steps.d.ts file
After that, autocompletion worked in my tests :)

Upgrade bundled TypeScript Compiler for IntelliJ

Is it possible to upgrade the Bundled TypeScript Compiler for IntelliJ? Currently, it lists 1.8.10. Or am I relegated to using the "Custom directory"?
Yes you can only point to the custom typescript directory. Eventually WebStorm will release an update that will bundle the latest version, but until then, it's custom for us.

AngularJS 2.0 TypeScript Intellij idea (or webstorm) - ES6 import syntax

Trying to make these steps to make AngularJS 2.0 sample app running.
On that step, putting code in app.ts:
/// <reference path="typings/angular2/angular2.d.ts" />
import {Component, View, bootstrap} from 'angular2/angular2';
Got latest 14.1.3 IntelliJ IDE.
But seems it does not understand 'import' (highlighting complain)
Q: IS that because It does not support yet TypeScript 1.5? (it the IDE settings I can see embedded 1.4 version).
Could it be compiled with that IDE?
it look like you didn't specify the compiler arguments to tell which module loader to use, also you want to make sure you are using the latest TypeScript Compiler, to this date the latest was 1.5.0 beta.
First
You can download the bin of the TypeScript compiler tsc and all other related files on their GitHub Repository:
https://github.com/Microsoft/TypeScript/tree/master/bin
or you can also install it as a Node.js Package:
npm install -g typescript
Second
You need to configure intelliJ properly by changing the Compiler version to custom and point to the location of the latest TypeScript bin folder
in IntelliJ press Ctrl+Alt+S, search for TypeScript and under Languages & Frameworks select TypeScript, make sure your IntelliJ is up to date though.
And to solve the problem you are asking here specify the following Command Line options:
--module "amd" --target "es5"
Screenshot:
Third
It is worth mentioning that the TypeScript 1.5 compiler and Angular 2 are both in Beta so this answer could be irrelevant in the following weeks or month.
Enjoy!
Dany
you need select javascript version in Preferences page.
Languages & Frameworks -> JavaScript
on the right page. JavaScript language version dropdown menu.
on my idea it's has some item below.
JavaScript 1.5
ECMAScript 5.1
JavaScript 1.6
JavaScript 1.7
JavaScript 1.8
JavaScript 1.8.6
ECMAScript 6
...
There is an option in IntelliJ where you can define a custom typescript version. Default is 1.4 but you can download 1.5 beta and assign that. The only problem with the sample I've seen is to activate 1.5 new argument to generate decorators metadata. IntelliJ always report that the TS process stopped.