All geek questions in one place

With just typescript (without webpack and no bable) I can get multiple files to run in the browser

Why does tsconfig.json need to make this work in Chrome? So I only had to run tsc and then view the file in a browser, and the corresponding result would be displayed in the console?

index.html contains:

<!DOCTYPE html>
<html>
    <head><title>TypeScript app</title></head>
    <body>
        <script src="dist/app.js"></script>
    </body>
</html>

index.ts contains

import { alpha } from "alpha";
import { beta } from "beta";
console.log(alpha + " " + beta);

alpha contains

export const alpha = 'alpha';

beta contains

export const beta = 'beta';

The entry point will be index.ts, and I would like all of this to be included in a single file called app.js.

+4
source share
1 answer

ES6 . , , , Webpack Babel, , , , , . TypeScript ES5 ( ), . RequireJS:

tsconfig.json

{
    "compilerOptions": {
        "module": "amd",
        "target": "es5",
        "outFile": "dist/app.js"
    },
    "include": [
        "src/**/*"
    ]
}

index.html

<!DOCTYPE html>
<html>
    <head><title>TypeScript app</title></head>
    <body>
        <script data-main="dist/app" src="https://cdnjs.cloudflare.com/ajax/libs/require.js/2.3.3/require.min.js"></script>
    </body>
</html>

/app.ts

// normally you would use a .d.ts file for RequireJS instead of declare
declare var require: (deps: string[]) => void;

require(['index']);

/index.ts

import { alpha } from "./alpha";
import { beta } from "./beta";
console.log(alpha + " " + beta);

/alpha.ts

export const alpha = 'alpha';

/beta.ts

export const beta = 'beta';
+6

Source: https://habr.com/ru/post/1672644/

More articles:


All Articles