Chain-to loader for webpack that inlines all html and style's in angular2 components.
- If you use awesome-typescript-loader set
"useWebpackText": true: Why? Because this allows for webpack to serve up chained files from loaders. Otherwise, there is no way to chain a loader to it. - Configure
tsconfig.json:
{
"compilerOptions": {
...
},
"awesomeTypescriptLoaderOptions": {
...
"useWebpackText": true //Allows loaders to be chained to awesome-typescript-loader.
},
}
- Make sure your app has a loader which can handle both .css/.html
require()s. I useraw-loader.
- Install into node_modules:
npm install --save-dev angular2-template-loader - Chain
angular2-template-loaderto your favorite typescript loader (works both withawesome-typescript-loaderandts-loader)
module: {
loaders: [
{
test: /\.ts$/,
loaders: ['awesome-typescript-loader', 'angular2-template-loader'],
exclude: [/\.(spec|e2e)\.ts$/]
}
]
},