打字稿导入不起作用

Question

I'm trying to solve this problem is already more than 6-8 hours. I think one of the problems is my english. =)

I use atom editor, electron, typescript, react

tsconfig.json

{
    "compilerOptions": {
        "target": "es5",
        "module": "commonjs",
        "moduleResolution": "node",
        "isolatedModules": false,
        "jsx": "react",
        "experimentalDecorators": true,
        "emitDecoratorMetadata": true,
        "declaration": false,
        "noImplicitAny": false,
        "noImplicitUseStrict": false,
        "removeComments": true,
        "noLib": false,
        "preserveConstEnums": true,
        "suppressImplicitAnyIndexErrors": true
    },
    "exclude": [
        "node_modules",
        "typings/browser",
        "typings/browser.d.ts"
    ],
    "compileOnSave": true,
    "buildOnSave": false,
    "atom": {
        "rewriteTsconfig": false
    }
}

app.ts:

import {hello} from "./func";
hello("TypeScript");

func.ts

export function hello(name: string){
    console.log(`Hello, ${name}`);
}

Start electron and get error:

Uncaught SyntaxError: Unexpected token import

then, create file react-test.ts:

import * as React from "react";

get error in atom editor:

Cannot find module 'react'

Question: I do not want more theory. There is a specific example. Please help me to solve it. By the way I did not have any problem with babel =)

Update #1:

Electron run command:

npm start

Project on github

Answer 1

First you need to transpile TypeScript to JavaScript with tsc command and in index.html file require app.js instead app.ts . Then run Electron with npm start