How to use awesome-typescript-loader - 10 common examples
To help you get started, we’ve selected a few awesome-typescript-loader examples, based on popular ways it is used in public projects.
Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.
raychenfj / ion-multi-picker / config / webpack.config.js View on Github 
// Workaround needed for angular 2 angular/angular#11580
new webpack.ContextReplacementPlugin(
// The (\\|\/) piece accounts for path separators in *nix and Windows
/angular(\\|\/)core(\\|\/)(esm(\\|\/)src|src)(\\|\/)linker/,
root('./src') // location of your src
)
];
if (!isTest && !isProd) {
config.plugins.push(new DashboardPlugin());
}
if (!isTest && !isTestWatch) {
config.plugins.push(
new ForkCheckerPlugin(),
// Generate common chunks if necessary
// Reference: https://webpack.github.io/docs/code-splitting.html
// Reference: https://webpack.github.io/docs/list-of-plugins.html#commonschunkplugin
new CommonsChunkPlugin({
name: ['vendor', 'polyfills']
}),
// Inject script and link tags into html files
// Reference: https://github.com/ampedandwired/html-webpack-plugin
new HtmlWebpackPlugin({
template: './src/public/index.html',
chunksSortMode: 'dependency'
})
// Extract css filespostcss: [
autoprefixer({
browsers: ['last 2 version']
})
]
}
})
];
if (!isTest && !isProd) {
config.plugins.push(new DashboardPlugin());
}
if (!isTest && !isTestWatch) {
config.plugins.push(
new ForkCheckerPlugin(),
// Generate common chunks if necessary
// Reference: https://webpack.github.io/docs/code-splitting.html
// Reference: https://webpack.github.io/docs/list-of-plugins.html#commonschunkplugin
new CommonsChunkPlugin({
name: ['vendor', 'polyfills']
}),
// Inject script and link tags into html files
// Reference: https://github.com/ampedandwired/html-webpack-plugin
new HtmlWebpackPlugin({
template: './src/public/index.html',
chunksSortMode: 'dependency'
}),
// Extract css filespostcss: [
autoprefixer({
browsers: ['last 2 version']
})
]
}
})
];
if (!isTest && !isProd) {
config.plugins.push(new DashboardPlugin());
}
if (!isTest && !isTestWatch) {
config.plugins.push(
new ForkCheckerPlugin(),
// Generate common chunks if necessary
// Reference: https://webpack.github.io/docs/code-splitting.html
// Reference: https://webpack.github.io/docs/list-of-plugins.html#commonschunkplugin
new CommonsChunkPlugin({
name: ['vendor', 'polyfills']
}),
// Inject script and link tags into html files
// Reference: https://github.com/ampedandwired/html-webpack-plugin
new HtmlWebpackPlugin({
template: './src/public/index.html',
chunksSortMode: 'dependency'
}),
// Extract css filesoptions: {
/**
* Apply the tslint loader as pre/postLoader
* Reference: https://github.com/wbuchwalter/tslint-loader
*/
tslint: {
emitErrors: false,
failOnHint: false
}
}
})
];
if (!isTest && !isTestWatch) {
config.plugins.push(
new ForkCheckerPlugin(),
// Generate common chunks if necessary
// Reference: https://webpack.github.io/docs/code-splitting.html
// Reference: https://webpack.github.io/docs/list-of-plugins.html#commonschunkplugin
new CommonsChunkPlugin({
name: ['vendor', 'polyfills']
}),
// Inject script and link tags into html files
// Reference: https://github.com/ampedandwired/html-webpack-plugin
new HtmlWebpackPlugin({
template: './src/public/index.html',
chunksSortMode: 'dependency'
}),
// Extract css filespublicPath: settings.publicPath,
target: fullPath("../resources/"),
resourceBundleOptions: resourceBundleOptions
}),
new HtmlWebpackPlugin({
template: './res/index.ejs',
chunksSortMode: 'none',
vendorsScript: getDebugOrCdnPath(settings, path.relative(root, settings.vendorsFile)),
apiScript: apiScript,
coreScript: coreScript,
resourceBundleOptions: resourceBundleOptions
}),
new HtmlWebpackScriptCrossoriginPlugin({}),
new CheckerPlugin()
// new HtmlWebpackPlugin({
// template: './res/electron.ejs',
// chunksSortMode: 'none',
// vendorsScript: settings.authority + (settings.minimize ? settings.publicPath : "/") + settings.vendorsFile
// }),
];
if (settings.devServer) {
plugins.push(new webpack.HotModuleReplacementPlugin());
}
var defines = {
DEBUG: settings.debug,
'process.env.NODE_ENV': settings.minimize ? '"production"' : '"dev"'
};'react-dom': {
commonjs: 'react-dom',
commonjs2: 'react',
amd: 'react-dom',
root: 'ReactDOM',
},
},
plugins: [
new webpack.NoEmitOnErrorsPlugin(),
new webpack.LoaderOptionsPlugin({
minimize: true,
debug: false,
}),
new TsConfigPathsPlugin(),
new CheckerPlugin(),
new CaseSensitivePathsPlugin(),
new webpack.DefinePlugin({
'process.env': {
NODE_ENV: JSON.stringify('production'),
},
}),
new webpack.optimize.UglifyJsPlugin({
sourceMap: true,
compress: {
// eslint-disable-next-line camelcase
screw_ie8: true,
warnings: false,
},
mangle: {
// eslint-disable-next-line camelcasemodule.exports = (baseConfig, env, defaultConfig) => {
defaultConfig.module.rules.push({
test: /\.tsx?$/,
include: path.resolve(__dirname, '../src'),
loader: require.resolve('awesome-typescript-loader')
});
defaultConfig.plugins.push(new CheckerPlugin());
defaultConfig.resolve.extensions.push('.ts', '.tsx');
// defaultConfig.module.rules.push({
// test: /\.jsx?$/,
// include: [
// path.resolve(__dirname, "node_modules/semantic-ui-react"),
// path.resolve(__dirname, "node_modules/byte-size")
// ],
// loader: "babel-loader"
// });
return defaultConfig;
};},
},
resolve : {
extensions : ['', '.ts', '.tsx', '.js'],
},
plugins : [
new webpack.HotModuleReplacementPlugin(),
new webpack.NormalModuleReplacementPlugin(
// swapp the environment files.
// See https://webpack.github.io/docs/list-of-plugins.html#normalmodulereplacementplugin
new RegExp(path.resolve(appRoot, envPath, appConfig.app.environments.source)
.replace(/[\-\[\]\/\{\}\(\)\*\+\?\.\\\^\$\|]/g, '\\$&')
),
path.resolve(appRoot, envPath, appConfig.app.environments[env])
),
new ForkCheckerPlugin(),
new PugIndexPlugin({
index : `${appRoot}/src/index.pug`,
buildDir : `${appConfig.app.buildDir}`,
}),
new CopyPlugin([
// assets
{
from : `src/${appConfig.app.assetsDir}`,
to : `${appConfig.app.assetsDir}`,
},
].concat(
// from build-config
copy.buildConfigFiles()
),
{
context : `${appRoot}`,config.output = {
path: root('dist'),
publicPath: isProd ? 'ng-select' : 'http://localhost:8080/',
filename: isProd ? 'js/[name].[hash].js' : 'js/[name].js',
chunkFilename: isProd ? '[id].[hash].chunk.js' : '[id].chunk.js'
};
/**
* Resolve
* Reference: http://webpack.github.io/docs/configuration.html#resolve
*/
config.resolve = {
// only discover files that have those extensions
extensions: ['.ts', '.js', '.json', '.css', '.scss', '.html'],
plugins: [
new TsConfigPathsPlugin({
configFileName: './demo/tsconfig.json',
compiler: 'typescript'
})
]
};
/**
* Loaders
* Reference: http://webpack.github.io/docs/configuration.html#module-loaders
* List: http://webpack.github.io/docs/list-of-loaders.html
* This handles most of the magic responsible for converting modules
*/
config.module = {
rules: [
// Support for .ts files.
{},
'react-dom': {
commonjs: 'react-dom',
commonjs2: 'react',
amd: 'react-dom',
root: 'ReactDOM',
},
},
plugins: [
new webpack.NoEmitOnErrorsPlugin(),
new webpack.LoaderOptionsPlugin({
minimize: true,
debug: false,
}),
new TsConfigPathsPlugin(),
new CheckerPlugin(),
new CaseSensitivePathsPlugin(),
new webpack.DefinePlugin({
'process.env': {
NODE_ENV: JSON.stringify('production'),
},
}),
new webpack.optimize.UglifyJsPlugin({
sourceMap: true,
compress: {
// eslint-disable-next-line camelcase
screw_ie8: true,
warnings: false,
},
mangle: {awesome-typescript-loader
Awesome TS loader for webpack
