Can I use typescript without requireJS?

Question

I have two classes:

export class ActionsCollection{ constructor(greeting :string){ this.greet(greeting); } public greet(greeting :string) { return "<h1>"+greeting+"</h1>"; } }

and:

 import {ActionsCollection} from "./actionsCollection"; class Greeter extends ActionsCollection{ constructor(public greeting: string) { super(greeting); } } alert(new Greeter("Hello, world!"));

Greeter generated in such file in which there is a line require("./actionsCollection") . But I want to make sure that all these files (* .ts) are generated in one of some main.js , without any require .

Is it possible to do so? And if so, how?

@ D-side Latest version, generated in ide webstorm 2016. But it is possible with the help of gulp.

D-side D-side 22.5k four thirty 54 · Accepted Answer · 2016-04-18T15:47:46

Any loader of modules all the same will be required. In TypeScript 1.8, the ability to glue modules into one file for the amd and system formats (- --outFile & --outFile ) was --outFile , but the appropriate module loader is needed even in this situation.

So you will have to subject the result of the TypeScript compiler to additional processing by a "wrapper" like Webpack or Browserify. For example, here is the (slightly corrected) Webpack configuration for building TypeScript into one file, published by James Brantly :

webpack.config.js

 module.exports = { entry: './src/greeter.ts', output: { filename: 'bundle.js' }, resolve: { extensions: ['', '.webpack.js', '.web.js', '.ts', '.js'] }, module: { loaders: [ { test: /\.ts$/, loader: 'ts-loader' } ] } }

package.json

 { "name": "example", "devDependencies": { "ts-loader": "^0.8.2", "webpack": "^1.13.0" } }

дерево проекта

 example |= src | |- greeter.ts | |- actionsCollection.ts |- package.json |- webpack.config.js |- bundle.js (генерируется webpack'ом, изначально отсутствует)

As a result, after launching the webpack stand-alone (at the browser level) bundle.js . And webpack --watch will generate the file again while saving the components.

You want to say that you can’t do without require in any case?
(this is strange, because it is normal when all the scripts are minified into one).
@ sanu0074 uh, there will always be modules at the output of tsc , the type of modules depends on the compilation flags.
And already the webpack modules webpack glued together in a single offline file with their simplified analogue require .
(I know the question looks silly, but it’s still relevant)
@ sanu0074 is difficult, I don’t know how to do it either in Gulp or in Webpack.
But the aforementioned webpack configuration is already working, it should be easy to refer to the result from Gulp .

Pleshevskiy pleshevskiy 535 2 13 · Answer 2 · 2016-04-18T15:04:24

You will need:

Node.js
NPM

Next, through the npm package manager, install gulp globally

sudo npm install -g gulp

Go to the project folder:

npm install --save-dev gulp gulp-tsc

Create a gulpfile.js file for all our tasks for gulp and write the following into it:

 var gulp = require('gulp'); var typescript = require('gulp-tsc'); gulp.task('build-tsc', function () { return gulp.src('src/**/*.ts') .pipe(typescript()) .pipe(gulp.dest('dist/')); }); gulp.task('watch', function () { gulp.watch('src/**/*.ts', ['build-tsc']); }); gulp.task('default', ['build-tsc', 'watch']);

build-tsc - build-tsc all our .ts files

watch - monitors changes in files and restarts compilation (in order not to constantly restart the script

After all our tasks (tasks) are configured, we run gulp in the terminal:

gulp

If everything was so simple :) No, it would compile into RequireJS modules.
Google has surprisingly many questions with compiling TS into a single file, so this situation has existed for a long time .-.
But that I am crucified, my own, I checked, it generates modules, it does not work without a loader.

Can I use typescript without requireJS?

2 answers 2

More articles: