Tslint: A computed property name in a class property declaration must refer to an expression whose type is a literal type or a 'unique symbol' type.

[iliyaZelenko]

Bug Report

• __TSLint version__: 5.14.0
• __TypeScript version__: 3.3.4000
• __Running TSLint via__: CLI

TypeScript code being linted

const PROPS = {
  VALUE: 'value'
}

export default class Main extends Vue {
  readonly [PROPS.VALUE]: string
}

with tslint.json configuration:

{
  "defaultSeverity": "warning",
  "extends": ["tslint:latest", "tslint-config-standard"],
  "rules": {
    "no-console": false,

    "member-access": [true, "no-public"],
    "object-literal-key-quotes": false,
    "no-var-requires": false,
    "interface-name" : [true, "never-prefix"],
    "prefer-const": true,
    "ordered-imports": [false],
    "object-literal-sort-keys": [false],
    "arrow-parens": false,

    "no-implicit-dependencies": false,
    "no-submodule-imports": [true, "~", "@"],

    "quotemark": [true, "single"],
    "semicolon": [true, "never"],
    "trailing-comma": [true, {
      "multiline": "never",
      "singleline": "never"
    }],
    "space-before-function-paren": true,

    "restrict-plus-operands": false
  }
}

Actual behavior

51:12 A computed property name in a class property declaration must refer to an
expression whose type is a literal type or a 'unique symbol' type.
    49 | })
    50 | export default class Main extends Vue {
  > 51 |   readonly [PROPS.VALUE]: string
       |     

Expected behavior

There was no error.

[JoshuaKGoldberg]

Hi @iliyaZelenko! This repository is for TSLint, a program that uses TypeScript APIs to provide additional analysis on TypeScript code. The error you're receiving is from TypeScript itself. Those issues should be filed on https://github.com/Microsoft/TypeScript.

Note: the reason why TypeScript is complaining is because PROPS.VALUE is itself not a literal type or 'unique symbol' type. It would be valid for someone to do this:

const PROPS = {
  VALUE: 'value'
}

PROPS.VALUE = 'aha!';

export default class Main extends Vue {
  readonly [PROPS.VALUE]: string
}

Once TypeScript 3.4 is released _(very soon!)_, you'll want to use a const assertion. Until then you can typecast VALUE to be as 'value':

const PROPS = {
  VALUE: 'value' as 'value'
}

Without an as const or as 'value', the type of PROPS.VALUE is general string.

[iliyaZelenko]

@JoshuaKGoldberg, thank you so much for the answer. Sorry for creating the question in the wrong place.

Thanks to you, now I understand what the "literal type" is.

Thanks for telling me what they will add _const assertion_ in version TypeScript 3.4. Since my project is new, I installed version ^3.4-rc and the error disappeared (with as const).

@JoshuaKGoldberg, really thank you!