Change color for const variables

How can I change the color of `const` variables in WebStorm? 

For Example, I'd like to change the color and style of HELLO_WORLD:

Changing the color for CONSTANTS does not seem to effect this. I have the JavaScript ES6 library selected Languages -> Frameworks. But still no option for const variables, as well, nothing for let and var specifically. 

My WebStorm Version:

WebStorm 2016.3
Build #WS-163.7743.13, built on November 8, 2016

Thanks!
Chris

 

0
11 comments

Constant name is colored according to Global variable preferences (Settings | Editor | Colors & Fonts | JavaScript); in your case, it's shown in grey because it's not used

0
Avatar
Permanently deleted user

I actually am using it further down in the file. And the color does not change to the color I assigned to Global variable. Could there be another issue causing this? 

0

please can you provide the full code snippet? May be, this constant is not global in your example?

0
Avatar
Permanently deleted user

If I use Local variable, then it does change. So it definitely does not see it as a Global. Which is odd, because it is outside the Class definition. I am using React Native/ES6 syntax. So, I suppose the question is, is there a way to add a custom color to ONLY 'const' and allow 'let' and 'var' be another color? 

0
Avatar
Permanently deleted user

Here is the entire file... 

```

/**
* @flow weak
*/

//
// ----------------- MainScene -----------------
//

import React, { Component, PropTypes } from 'react';
import {
StatusBar,
StyleSheet,
Text
} from 'react-native';

// Packages
import { Actions, ActionConst } from 'react-native-router-flux';

// Helpers
import AppHelper from 'App/Utils/AppHelper';
import { Container, Row, Column } from 'App/Utils/Grid/Grid';
import { Login } from 'App/Net/FacebookSDK';

// Controller
import Controller from 'App/Controller';
const controller = new Controller({});

const HELLO_WORLD = 'Hello World';

export default class MainScene extends Component {

constructor(props) {
super(props);

// Set Initial state
this.state = {data: controller.getData()};
controller.onUpdate((data) => {
this.setState({data: data});
});
}

componentWillMount() {
let hello = HELLO_WORLD;
console.log(hello);
}

componentDidMount() {
}

render() {
return(
<Container>
<StatusBar hidden={true} />
<Column style={{justifyContent: 'center', alignItems: 'center'}} outline={true}>
<Text style={globalStyles.h1}>{"Login Screen"}</Text>
<Login />
</Column>
</Container>
);
}
}```

0

No, there is no way to set a color to const only; please feel free to file a feature request to youtrack, https://youtrack.jetbrains.com/issues/WEB

0

>So it definitely does not see it as a Global. Which is odd, because it is outside the Class definition.

may be because your variable is declared in a module, so it has a module scope, not global one

0
Avatar
Permanently deleted user

Thank you Elena! Appreciate your help! I went ahead and added a feature request. 

0
Avatar
Permanently deleted user

@Fostertime can you link to the ticket you created?

0

@Tagrain it's https://youtrack.jetbrains.com/issue/WEB-24162, I believe; please feel free to vote for it

0
Avatar
Permanently deleted user
0

Please sign in to leave a comment.