Blueprint: [blueprintjs/datetime] Errors after adding a library

[RustamKuramshin]

"@blueprintjs/datetime": "^3.14.0"
Chrome 77.0.3865.120
Ubuntu 18.04

After adding the library to the project, the following errors occur:

/home/rkuramshin/go/src/xgit.tradingview.com/tv/backend-dashboard/frontend/node_modules/@blueprintjs/core/lib/esm/common/abstractComponent2.d.ts
    Error:Error:line (7)TS2424: Class 'Component<P, S, SS>' defines instance member function 'componentWillUpdate', but extended class 'AbstractComponent2<P, S, SS>' defines it as instance member property.
    Error:Error:line (8)TS2424: Class 'Component<P, S, SS>' defines instance member function 'componentWillReceiveProps', but extended class 'AbstractComponent2<P, S, SS>' defines it as instance member property.
    Error:Error:line (9)TS2424: Class 'Component<P, S, SS>' defines instance member function 'componentWillMount', but extended class 'AbstractComponent2<P, S, SS>' defines it as instance member property.
/home/rkuramshin/go/src/xgit.tradingview.com/tv/backend-dashboard/frontend/node_modules/@blueprintjs/core/lib/esm/common/abstractPureComponent2.d.ts
    Error:Error:line (7)TS2424: Class 'PureComponent<P, S, SS>' defines instance member function 'componentWillUpdate', but extended class 'AbstractPureComponent2<P, S, SS>' defines it as instance member property.
    Error:Error:line (8)TS2424: Class 'PureComponent<P, S, SS>' defines instance member function 'componentWillReceiveProps', but extended class 'AbstractPureComponent2<P, S, SS>' defines it as instance member property.
    Error:Error:line (9)TS2424: Class 'PureComponent<P, S, SS>' defines instance member function 'componentWillMount', but extended class 'AbstractPureComponent2<P, S, SS>' defines it as instance member property.
/home/rkuramshin/go/src/xgit.tradingview.com/tv/backend-dashboard/frontend/node_modules/@blueprintjs/core/lib/esm/components/drawer/drawer.d.ts
    Error:Error:line (69)TS1039: Initializers are not allowed in ambient contexts.
    Error:Error:line (70)TS1039: Initializers are not allowed in ambient contexts.
    Error:Error:line (71)TS1039: Initializers are not allowed in ambient contexts.
/home/rkuramshin/go/src/xgit.tradingview.com/tv/backend-dashboard/frontend/node_modules/@blueprintjs/core/lib/esm/components/icon/icon.d.ts
    Error:Error:line (60)TS1039: Initializers are not allowed in ambient contexts.
    Error:Error:line (61)TS1039: Initializers are not allowed in ambient contexts.
/home/rkuramshin/go/src/xgit.tradingview.com/tv/backend-dashboard/frontend/node_modules/@blueprintjs/core/lib/esm/components/spinner/spinner.d.ts
    Error:Error:line (32)TS1039: Initializers are not allowed in ambient contexts.
    Error:Error:line (33)TS1039: Initializers are not allowed in ambient contexts.
    Error:Error:line (34)TS1039: Initializers are not allowed in ambient contexts.
/home/rkuramshin/go/src/xgit.tradingview.com/tv/backend-dashboard/frontend/node_modules/@blueprintjs/datetime/lib/esm/datePickerCore.d.ts
    Error:Error:line (23)TS2693: 'LocaleUtils' only refers to a type, but is being used as a value here.
/home/rkuramshin/go/src/xgit.tradingview.com/tv/backend-dashboard/frontend/node_modules/@blueprintjs/datetime/lib/esm/index.d.ts
    Error:Error:line (3)TS2693: 'LocaleUtils' only refers to a type, but is being used as a value here.
/home/rkuramshin/go/src/xgit.tradingview.com/tv/backend-dashboard/frontend/node_modules/react-day-picker/types/DayPicker.d.ts
    Error:Error:line (15)TS2693: 'LocaleUtils' only refers to a type, but is being used as a value here.
/home/rkuramshin/go/src/xgit.tradingview.com/tv/backend-dashboard/frontend/node_modules/react-day-picker/types/props.d.ts
    Error:Error:line (17)TS2693: 'LocaleUtils' only refers to a type, but is being used as a value here.
    Error:Error:line (35)TS2693: 'LocaleUtils' only refers to a type, but is being used as a value here.
    Error:Error:line (42)TS2693: 'LocaleUtils' only refers to a type, but is being used as a value here.
    Error:Error:line (70)TS2693: 'LocaleUtils' only refers to a type, but is being used as a value here.
/home/rkuramshin/go/src/xgit.tradingview.com/tv/backend-dashboard/frontend/node_modules/react-day-picker/types/utils.d.ts
    Error:Error:line (29)TS1036: Statements are not allowed in ambient contexts.

Here is a list of my dependencies:

{
    "name": "devops-automation",
    "version": "1.0.0",
    "private": true,
    "description": "devops-automation",
    "main": "index.js",
    "scripts": {
        "start": "webpack-dev-server --debug --devtool cheap-module-source-map --output-pathinfo --history-api-fallback --hot --inline --progress --colors --host localhost --port 3000 --open",
        "build": "webpack -p"
    },
    "license": "EULA",
    "devDependencies": {
        "@tradingview/tslint-rules": "0.7.1",
        "@types/bootstrap-table": "1.11.5",
        "@types/classnames": "2.2.3",
        "@types/history": "4.6.0",
        "@types/jquery": "3.3.4",
        "@types/lodash": "4.14.110",
        "@types/node": "8.0.26",
        "@types/react": "16.8.13",
        "@types/react-dom": "16.8.4",
        "@types/react-hot-loader": "3.0.6",
        "@types/react-redux": "5.0.6",
        "@types/react-router": "4.0.15",
        "@types/react-router-dom": "4.2.7",
        "@types/reactstrap": "5.0.27",
        "@types/recompose": "0.26.1",
        "@types/redux-actions": "1.2.8",
        "@types/webpack-env": "1.13.0",
        "@types/react-dates": "17.1.5",
        "awesome-typescript-loader": "3.5.0",
        "css-loader": "1.0.1",
        "extract-text-webpack-plugin": "3.0.2",
        "file-loader": "0.11.2",
        "html-loader": "0.5.5",
        "html-webpack-plugin": "2.30.1",
        "postcss": "6.0.22",
        "postcss-browser-reporter": "0.5.0",
        "postcss-cssnext": "3.1.0",
        "postcss-loader": "3.0.0",
        "postcss-reporter": "5.0.0",
        "postcss-url": "7.3.2",
        "react-hot-loader": "3.1.3",
        "style-loader": "0.18.2",
        "tslint": "5.15.0",
        "tslint-eslint-rules": "4.1.1",
        "tslint-microsoft-contrib": "5.0.3",
        "tslint-react": "3.6.0",
        "typescript": "2.8.3",
        "url-loader": "1.1.2",
        "vrsource-tslint-rules": "5.8.2",
        "webpack": "3.12.0",
        "webpack-dev-server": "2.11.5"
    },
    "dependencies": {
        "@blueprintjs/datetime": "^3.14.0",
        "@tradingview/core": "0.1.6",
        "@types/react-autosuggest": "9.3.10",
        "@types/react-infinite-scroller": "1.2.1",
        "bootstrap": "4.3.1",
        "bootstrap-table": "1.12.1",
        "classnames": "2.2.6",
        "jquery": "3.3.1",
        "lodash": "4.17.11",
        "moment": "2.22.2",
        "popper.js": "1.14.3",
        "react": "16.3.2",
        "react-autosuggest": "9.4.3",
        "react-dates": "20.1.0",
        "react-dom": "16.3.3",
        "react-infinite-scroller": "1.2.4",
        "react-popper": "0.10.4",
        "react-redux": "5.0.7",
        "react-router": "4.3.1",
        "react-router-dom": "4.3.1",
        "reactstrap": "6.1.0",
        "recompose": "0.27.1",
        "redux": "3.7.2",
        "redux-actions": "2.4.0",
        "ws": "6.2.0"
    }
}

My tslint.json

{
  "rulesDirectory": [
    "node_modules/tslint-eslint-rules/dist/rules",
    "node_modules/tslint-microsoft-contrib",
    "node_modules/vrsource-tslint-rules/rules",
    "node_modules/tslint-react/rules",
    "node_modules/@tradingview/tslint-rules/lib/rules"
  ],
  "rules": {
    "adjacent-overload-signatures": true,
    "align": [
      true,
      "parameters",
      "arguments",
      "statements"
    ],
    "array-type": [true, "array"],
    "arrow-parens": true,
    "arrow-return-shorthand": false,
    "await-promise": false,
    "ban": false,
    "ban-comma-operator": true,
    "ban-types": [
      true,
      ["Object", "Avoid using the `Object` type. Did you mean `object`?"],
      ["Function", "Avoid using the `Function` type. Prefer a specific function type, like `() => void`."],
      ["Boolean", "Avoid using the `Boolean` type. Did you mean `boolean`?"],
      ["Number", "Avoid using the `Number` type. Did you mean `number`?"],
      ["String", "Avoid using the `String` type. Did you mean `string`?"],
      ["Symbol", "Avoid using the `Symbol` type. Did you mean `symbol`?"]
    ],
    "binary-expression-operand-order": false,
    "callable-types": true,
    "class-name": true,
    "comment-format": [true, "check-space"],
    "completed-docs": false,
    "curly": true,
    "cyclomatic-complexity": [true, 13],
    "deprecation": true,
    "encoding": true,
    "eofline": true,
    "file-header": false,
    "forin": true,
    "import-spacing": true,
    "indent": [true, "spaces", 4],
    "interface-name": [false, "never-prefix"],
    "interface-over-type-literal": true,
    "jsdoc-format": true,
    "label-position": false,
    "linebreak-style": false,
    "match-default-export-name": true,
    "max-classes-per-file": [true, 5],
    "max-file-line-count": false,
    "max-line-length": false,
    "member-access": [
      true,
      "check-accessor",
      "check-constructor"
    ],
    "member-ordering": [
      true,
      {
        "order": [
          "public-static-field",
          "protected-static-field",
          "private-static-field",
          "public-instance-field",
          "protected-instance-field",
          "private-instance-field",
          "constructor",
          "public-instance-method",
          "public-static-method",
          "protected-instance-method",
          "protected-static-method",
          "private-instance-method",
          "private-static-method"
        ]
      }
    ],
    "new-parens": true,
    "newline-before-return": false,
    "no-angle-bracket-type-assertion": true,
    "no-any": true,
    "no-arg": true,
    "no-bitwise": false,
    "no-boolean-literal-compare": false,
    "no-conditional-assignment": true,
    "no-consecutive-blank-lines": true,
    "no-console": false,
    "no-construct": true,
    "no-debugger": true,
    "no-duplicate-imports": true,
    "no-duplicate-super": true,
    "no-duplicate-switch-case": true,
    "no-duplicate-variable": true,
    "no-empty": true,
    "no-empty-interface": false,
    "no-eval": true,
    "no-floating-promises": false,
    "no-for-in-array": true,
    "no-implicit-dependencies": false,
    "no-import-side-effect": false,
    "no-inferrable-types": [true, "ignore-params", "ignore-properties"],
    "no-inferred-empty-object-type": false,
    "no-internal-module": true,
    "no-invalid-template-strings": true,
    "no-invalid-this": [false],
    "no-magic-numbers": false,
    "no-mergeable-namespace": true,
    "no-misused-new": true,
    "no-namespace": false,
    "no-non-null-assertion": true,
    "no-null-keyword": false,
    "no-object-literal-type-assertion": true,
    "no-parameter-properties": true,
    "no-parameter-reassignment": false,
    "no-redundant-jsdoc": true,
    "no-reference": false,
    "no-reference-import": true,
    "no-require-imports": false,
    "no-return-await": true,
    "no-shadowed-variable": false,
    "no-string-literal": true,
    "no-string-throw": true,
    "no-submodule-imports": false,
    "no-switch-case-fall-through": true,
    "no-this-assignment": true,
    "no-trailing-whitespace": true,
    "no-unbound-method": false,
    "no-unnecessary-callback-wrapper": false,
    "no-unnecessary-class": true,
    "no-unnecessary-initializer": true,
    "no-unnecessary-qualifier": true,
    "no-unnecessary-type-assertion": true,
    "no-unsafe-any": false,
    "no-unsafe-finally": true,
    "no-unused-expression": true,
    "no-unused-variable": false,
    "no-use-before-declare": false,
    "no-var-keyword": true,
    "no-var-requires": true,
    "no-void-expression": false,
    "non-literal-require": false,
    "number-literal-format": true,
    "object-literal-key-quotes": [true, "as-needed"],
    "object-literal-shorthand": false,
    "object-literal-sort-keys": false,
    "one-line": [
      true,
      "check-catch",
      "check-else",
      "check-finally",
      "check-open-brace",
      "check-whitespace"
    ],
    "one-variable-per-declaration": true,
    "only-arrow-functions": [true, "allow-declarations"],
    "ordered-imports": false,
    "prefer-conditional-expression": false,
    "prefer-const": true,
    "prefer-for-of": false,
    "prefer-function-over-method": false,
    "prefer-method-signature": false,
    "prefer-object-spread": false,
    "prefer-switch": false,
    "prefer-template": false,
    "promise-function-async": false,
    "quotemark": [true, "single", "avoid-escape", "jsx-double"],
    "radix": false,
    "restrict-plus-operands": false,
    "return-undefined": false,
    "semicolon": [true, "always"],
    "space-before-function-paren": [true, { "anonymous": "never", "named": "never" }],
    "space-within-parens": [true, 0],
    "strict-boolean-expressions": false,
    "strict-type-predicates": true,
    "switch-default": false,
    "switch-final-break": false,
    "trailing-comma": [
      true,
      {
        "singleline": "never",
        "multiline": {
          "arrays": "always",
          "exports": "always",
          "functions": "never",
          "imports": "always",
          "objects": "always",
          "typeLiterals": "always"
        }
      }
    ],
    "triple-equals": [true, "allow-null-check"],
    "type-literal-delimiter": true,
//    "typedef": [
//      true,
//      "call-signature",
//      "parameter",
//      "arrow-parameter",
//      "property-declaration",
//      "member-variable-declaration"
//    ],
    "typedef-whitespace": [
      true,
      {
        "call-signature": "nospace",
        "index-signature": "nospace",
        "parameter": "nospace",
        "property-declaration": "nospace",
        "variable-declaration": "nospace"
      },
      {
        "call-signature": "onespace",
        "index-signature": "onespace",
        "parameter": "onespace",
        "property-declaration": "space",
        "variable-declaration": "onespace"
      }
    ],
    //"typeof-compare": true,
    "unified-signatures": false,
    "use-default-type-parameter": false,
    "use-isnan": true,
    "variable-name": [
      true,
      "ban-keywords",
      "check-format",
      "allow-leading-underscore"
    ],
    "whitespace": [
      true,
      "check-branch",
      "check-decl",
      "check-operator",
      "check-module",
      "check-separator",
      "check-type",
      "check-type-operator"
    ],


    "array-bracket-spacing": false,
    "block-spacing": false,
    "brace-style": [true, "1tbs", { "allowSingleLine": true }],
    "handle-callback-err": false,
    "no-empty-character-class": true,
    "no-ex-assign": true,
    "no-extra-boolean-cast": false,
    "no-extra-semi": false,
    "no-inner-declarations": true,
    "no-irregular-whitespace": true,
    "no-multi-spaces": false,
    "no-unexpected-multiline": false,
    "object-curly-spacing": false,
    "sort-imports": false,
    "space-in-parens": false,
    "ter-arrow-body-style": false,
    "ter-arrow-parens": false,
    "ter-arrow-spacing": false,
    "ter-func-call-spacing": false,
    "ter-indent": false,
    "ter-max-len": false,
    "ter-no-irregular-whitespace": false,
    "ter-no-sparse-arrays": false,
    "ter-prefer-arrow-callback": false,
    "valid-jsdoc": false,


    "chai-prefer-contains-to-index-of": false,
    "chai-vague-errors": false,
    "export-name": false,
    "function-name": false,
    "import-name": false,
    "insecure-random": false,
    "jquery-deferred-must-complete": false,
    "max-func-body-length": false,
    "missing-jsdoc": false,
    "missing-optional-annotation": false,
    "mocha-avoid-only": false,
    "mocha-no-side-effect-code": false,
    "mocha-unneeded-done": true,
    "no-backbone-get-set-outside-model": false,
    "no-banned-terms": true,
    "no-constant-condition": [true, { "checkLoops": false }],
    "no-control-regex": false,
    "no-cookies": false,
    "no-delete-expression": true,
    "no-disable-auto-sanitization": true,
    "no-document-domain": true,
    "no-document-write": false,
    "no-duplicate-case": true,
    "no-duplicate-parameter-names": false,
    "no-empty-interfaces": false,
    "no-empty-line-after-opening-brace": true,
    "no-exec-script": true,
    "no-for-in": false,
    "no-function-constructor-with-string-args": true,
    "no-function-expression": false,
    "no-http-string": [
      true,
      "http://www.w3.org/2000/svg",
      "http://schemas.xmlsoap.org/soap/envelope/"
    ],
    "no-increment-decrement": false,
    "no-inner-html": false,
    "no-invalid-regexp": true,
    "no-jquery-raw-elements": false,
    "no-missing-visibility-modifiers": false,
    "no-multiline-string": false,
    "no-multiple-var-decl": false,
    "no-octal-literal": true,
    "no-regex-spaces": true,
    "no-relative-imports": false,
    "no-reserved-keywords": false,
    "no-single-line-block-comment": false,
    "no-sparse-arrays": true,
    //"no-stateless-class": true,
    "no-string-based-set-immediate": true,
    "no-string-based-set-interval": true,
    "no-string-based-set-timeout": true,
    "no-suspicious-comment": false,
    "no-typeof-undefined": true,
    "no-unexternalized-strings": false,
    "no-unnecessary-bind": true,
    "no-unnecessary-field-initialization": true,
    "no-unnecessary-local-variable": true,
    "no-unnecessary-override": true,
    "no-unnecessary-semicolons": true,
    "no-unsupported-browser-code": [true, ["IE 11", "Firefox > 40", "Chrome >= 45"]],
    "no-useless-files": false,
    //"no-var-self": true,
    "no-with-statement": true,
    "possible-timing-attack": false,
    "prefer-array-literal": true,
    "prefer-type-cast": false,
    "promise-must-complete": true,
    "react-a11y-anchors": false,
    "react-a11y-aria-unsupported-elements": false,
    "react-a11y-event-has-role": false,
    "react-a11y-image-button-has-alt": false,
    "react-a11y-img-has-alt": false,
    "react-a11y-lang": false,
    "react-a11y-meta": false,
    "react-a11y-props": false,
    "react-a11y-proptypes": false,
    "react-a11y-role": false,
    "react-a11y-role-has-required-aria-props": false,
    "react-a11y-role-supports-aria-props": false,
    "react-a11y-tabindex-no-positive": false,
    "react-a11y-titles": false,
    "react-anchor-blank-noopener": false,
    "react-iframe-missing-sandbox": false,
    "react-no-dangerous-html": false,
    "react-this-binding-issue": false,
    "react-tsx-curly-spacing": false,
    "react-unused-props-and-state": false,
    "underscore-consistent-invocation": false,
    "use-named-parameter": false,
    "valid-typeof": false,


    "conditional-expression-parens": false,
    "dot-notation": false,
    "ext-variable-name": false,
    "literal-spacing": [
      true,
      {
        "array": ["never"],
        "object": ["always"],
        "import": ["always"]
      }
    ],
    "max-params": [true, 6],
    "multiline-arrow": false,
    "no-jasmine-focus": false,
    "no-param-reassign": false,
    "prefer-case-blocks": false,
    "prefer-literal": false,


    "no-declare-interface": true,
    "no-implicit-boolean-cast": false,
    "no-invalid-translations": true,
    "no-invalid-void": true,
    "no-object-destructuring-in-params": false,
    "no-property-getter-setter": true,
    "no-use-strict": true,
    "translations-category": true,
    "tv-variable-name": false,
    "type-operator-spaces": true,


    "jsx-alignment": true,
    "jsx-ban-props": false,
    "jsx-boolean-value": false,
    "jsx-curly-spacing": [true, "always"],
    "jsx-equals-spacing": false,
    "jsx-key": false,
    "jsx-no-bind": true,
    "jsx-no-lambda": true,
    "jsx-no-multiline-js": false,
    "jsx-no-string-ref": true,
    "jsx-self-close": false,
    "jsx-use-translation-function": false,
    "jsx-wrap-multiline": true
  }
}

My tsconfig.json

{
    "compilerOptions": {
        "sourceMap": true,
        "target": "es5",
        "downlevelIteration": true,
        "jsx": "react",
        "module": "commonjs",
        "moduleResolution": "node",
        "emitDecoratorMetadata": true,
        "experimentalDecorators": true,
        "declaration": false,
        "noImplicitAny": true,
        "noImplicitReturns": true,
        "removeComments": true,
        "strictNullChecks": true,
        "noFallthroughCasesInSwitch": true,
        "noEmitOnError": true,
        "noUnusedLocals": false,
        "strict": true,
        "strictFunctionTypes": false,
        "stripInternal": true,
        "outDir": "build",
        "baseUrl": ".",
        "paths": {
            "*": [
                "src/*",
                "node_modules/*"
            ]
        },
        "lib": [
            "es6",
            "es7",
            "dom",
            "es2017.object"
        ]
    },
    "exclude": [
        "dist",
        "build",
        "node_modules"
    ]
}

[fredrikjacobson]

I'm receiving the same error:
Error:Error:line (15)TS2693: 'LocaleUtils' only refers to a type, but is being used as a value here.

Seems to occurr because LocaleUtils is exported as an interface and not as a const like DateUtils and ModifiersUtils in react-day-picker?

Was this issue not resolved by this? https://github.com/gpbl/react-day-picker/pull/834

[mprotasov]

I used to fix problem with Error:Error:line (15)TS2693: 'LocaleUtils' only refers to a type, but is being used as a value here. It was fixed in version 7.3.2 of react-day-picker, then broken in version 7.4.0, then again fixed in current unreleased master.

I changed my package-lock.jsonin following way:

1. Remove "react-day-picker": "^7.3.2" from "requires" section
2. Add "react-day-picker": { "version": "7.3.2" }
   to "dependencies" section (force datetime to use specific version of lib)
3. Delete node_modules dir and rerun npm install

It is temporary fix, the problem should be fixed after release of new version of react-day-picker.

Hope this helps

[sparklingToad]

I have the same issue, as this is fixed on master - would it be possible to release the fix? That would be awesome.

[adidahiya]

the fix was released in @blueprintjs/datetime 3.15.2: https://github.com/palantir/blueprint/wiki/3.x-Changelog#blueprintjsdatetime-3152