Skip to main content
Version: Next

Changing Typescript Version

Since Smartface supports Typescript and Distribution steps are moved into Appcircle, the output while developing on Smartface IDE and published application might differ, depending on which Typescript version is used on both environment.

How to Check Current Typescript Version on Smartface IDE​

  • Open any Typescript file (any file with .ts extension)
  • Verify that the file type is detected as Typescript
  • Check the version located right below

How to Check Current Typescript Version used on Published Application​

Published applications use Typescript version which is located at package.json which is under workspace directory.

Here is the package.json content copied from empty workspace.

/projects/workspace/package.json
{
    "dependencies": {
        "@smartface/wsbuilder": "^2.0.2",
        "typescript": "4.0.2"
    },
    "scripts": {
        "dev": "tsc -w",
        "build:tsc": "rm -rf ./dist && tsc",
        "build:sf": "SMF_CIDE_WS_PATH=$PWD sfBuilder --standalone",
        "build:transpile": "npm run build:sf && npm run build:tsc",
        "build": "npm run build:tsc",
        "watch": "SMF_CIDE_WS_PATH=$PWD concurrently 'sfBuilder'  'tsc -w'"
    }
}

As it can be seen, published application will use 4.0.2 as default but the image taken from Smartface IDE above uses 4.2.3 . To remove the discrepancy, we can enforce Smartface IDE to use the Typescript version at node_modules.

info

Smartface IDE bundles a specific version of Typescript appropriate for that time it was released. The versions might differ to date.

How to Change Typescript Version of the Smartface IDE​

  • Open the preferences
  • Type tsdk on the search bar and click Edit in settings.json
  • /projects/.theia/settings.json file will be opened and typescript.tsdk property with null will be added there
  • Change the value like this
/projects/.theia/settings.json
{
   //... your other configurations
   "typescript.tsdk": "/projects/workspace/node_modules/typescript/lib"
}
  • To verify, open a Typescript file and check the version as shown above
  • If you receive an error like this, it means node modules are not installed on your workspace directory.
  • We should launch npm install in that directory. Open up a Smartface Terminal
  • A new Smartface Terminal window will be opened at the bottom of the screen (you can adjust the placement wherever you want)
  • Notice that the default directory is /projects. We should type in cd workspace and press enter.
  • After you are in workspace directory, type npm install
  • Wait for the modules to be installed. It might take 1-2 minute depending on the package count you have in your package.json
  • After the installation is finished, open up a Typescript file again and click on the version at the bottom right again. Verify the versions, then click at Use the Use VS Code's Version
  • Your Typescript version should be changing. Give the compiler a few moments to recompile the code.