typescript-loader
TypeScript Webpack Loader
Last updated 7 years ago .
· Repository · Bugs · Original npm · Tarball · package.json
$ cnpm install typescript-loader 
SYNC missed versions from official npm registry.

TypeScript Webpack Loader

TypeScript loader for Webpack.

Example Configuration

webpack.config.js

module.exports = {

  // Currently we need to add '.ts' to resolve.extensions array.
  resolve: {
    extensions: ['', '.webpack.js', '.web.js', '.ts', '.js']
  },

  // Source maps support (or 'inline-source-map' also works)
  devtool: 'source-map',

  // Add loader for .ts files.
  module: {
    loaders: [
      {
        test: /\.ts$/,
        loader: 'typescript-loader'
      }
    ]
  }
};

After that, you would be able to write JSX in TypeScript!

Best Practices

Using with JSX-TypeScript compiler

You can use typescript-loader together with jsx-typscript compiler which has support for JSX syntax (used in React.js).

For that you need to install jsx-typescript:

% npm install jsx-typescript

And specify typescriptCompiler loader option:

module.exports = {

  module: {
    loaders: [
      {
        test: /\.ts$/,
        loader: 'typescript-loader?typescriptCompiler=jsx-typescript'
      }
    ]
  }
};

External Modules

The most natural way to structure your code with TypeScript and webpack is to use external modules, and these work as you would expect.

npm install --save react
import React = require('react');

Internal Modules

TypeScript Loader will work with internal modules too, however acquiring a reference to modules declared this way requires some work using the exports-loader. This is required because webpack wraps every file in a closure and internal modules are meant to run in a global context.

foo.ts

module Foo {
  export var bar = 42;
}

main.ts

/// <reference path="foo.ts" />
var foo: typeof Foo = require('exports?Foo!./foo');
console.log(foo.bar) // 42

Current Tags

  • 1.1.3                                ...           latest (7 years ago)

9 Versions

  • 1.1.3                                ...           7 years ago
  • 1.1.2                                ...           7 years ago
  • 1.1.1                                ...           7 years ago
  • 1.1.0                                ...           7 years ago
  • 1.0.0                                ...           7 years ago
  • 0.1.2                                ...           8 years ago
  • 0.1.1                                ...           8 years ago
  • 0.1.0                                ...           8 years ago
  • 0.0.0                                ...           8 years ago
Maintainers (2)
Dependencies (4)
Dev Dependencies (0)
None

Copyright © npmmirror.com | 浙ICP备15033595号-63 |