{"_id":"angular1-templateurl-loader","_rev":"2-73aae81534c8d56313a1b63bba4d48b7","name":"angular1-templateurl-loader","description":"Webpack loader that inlines all html for AngularJS components/directives.","dist-tags":{"latest":"1.0.0"},"versions":{"1.0.0":{"name":"angular1-templateurl-loader","version":"1.0.0","description":"Webpack loader that inlines all html for AngularJS components/directives.","main":"index.js","scripts":{"test":"mocha --reporter spec","coverage":"istanbul cover _mocha -- -R spec","preversion":"npm test","version":"git add -A","postversion":"git push && git push --tags","release:patch":"npm version patch && git push && git push --tags && npm publish"},"repository":{"type":"git","url":"git+https://github.com/tmarun/angular1-templateurl-loader.git"},"keywords":["angularjs","webpack","loader"],"author":{"name":"Arunagiri TM"},"license":"MIT","bugs":{"url":"https://github.com/tmarun/angular1-templateurl-loader/issues"},"homepage":"https://github.com/tmarun/angular1-templateurl-loader#readme","devDependencies":{"codecov":"^2.1.0","istanbul":"^0.4.5","mocha":"^3.2.0","should":"^11.2.1"},"dependencies":{"loader-utils":"^1.1.0"},"gitHead":"8d68fe2587d20749107d279ea5a2077e5da8e909","_id":"angular1-templateurl-loader@1.0.0","_shasum":"b056e19269f5058ed916c0085c6dd336c4983b5d","_from":".","_npmVersion":"4.0.1","_nodeVersion":"6.10.2","_npmUser":{"name":"tm.arun","email":"tm.arunagiri@gmail.com"},"dist":{"shasum":"b056e19269f5058ed916c0085c6dd336c4983b5d","tarball":"https://registry.npmjs.org/angular1-templateurl-loader/-/angular1-templateurl-loader-1.0.0.tgz","integrity":"sha512-PfnEJsQQsPQXy5aXd2NoiwQMwqA3m9gHmpYjBoMXtonjvXh5W9XEv1xeRJX97nQK9LLeWHgoEuzYlOPlaQCg+Q==","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIHm37HJKDvSoFuVmUvNAMBRqDViVF7lLptDRgHXbIEACAiAV4mNgsoOW+dOc8Hs6qQLwXAaNjNmodLmva+1MTgkeuQ=="}]},"maintainers":[{"name":"tm.arun","email":"tm.arunagiri@gmail.com"}],"_npmOperationalInternal":{"host":"packages-18-east.internal.npmjs.com","tmp":"tmp/angular1-templateurl-loader-1.0.0.tgz_1494168571900_0.903632736299187"}}},"readme":"# angular1-templateurl-loader\nWebpack loader that inlines all html for AngularJS code that specifies a `templateUrl`.  It is a port of code from [angular2-template-loader](https://github.com/TheLarkInn/angular2-template-loader).\n\n[![Build Status](https://travis-ci.org/tm.arun/angular1-templateurl-loader.svg?branch=master)](https://travis-ci.org/tm.arun/angular1-templateurl-loader)\n\n### Quick Links\n- [Installation](#installation)\n- [Requirements](#requirements)\n- [Example usage](#example-usage)\n- [How does it work](#how-does-it-work)\n- [Common Issues](#common-issues)\n\n### Installation\nOption 1: Install from [npm](https://www.npmjs.com/package/angular1-templateurl-loader).\n- `npm install angular1-templateurl-loader --save-dev`\n\nOption 2: Install from [yarn](https://yarnpkg.com/en/package/angular1-templateurl-loader).\n- `yarn add angular1-templateurl-loader --dev`\n\nChain the `angular1-templateurl-loader` to your currently used TypeScript loader.\n\n```js\nloaders: ['awesome-typescript-loader', 'angular1-templateurl-loader'],\n```\n\n### Requirements\nTo be able to use the template loader you must have a loader registered, which can handle `.html` files.\n> The most recommended loader is [`raw-loader`](https://github.com/webpack/raw-loader)\n\nThis loader allows you to decouple templates from the component file. This is particularly useful  when building complex components that have large templates.\n\n### Example Usage\n\n#### Webpack\nHere is an example markup of the `webpack.config.js`, which chains the `angular1-templateurl-loader` to the `awesome-typescript-loader`\nWill resolve for the template from the resolve.root, in this case the current directory of the file or in  the app's root directory\n\n```js\nmodule: {\n    resolve: {\n        root: [__dirname, './'],\n        extensions: ['', '.ts', '.js', '.json'],\n    },\n  rules: [\n    {\n      test: /\\.ts$/,\n      use: [\n        {\n          loader: 'awesome-typescript-loader'\n        },\n        {\n          loader: 'angular1-templateurl-loader'\n          \n        }\n      ]\n      exclude: [/\\.(spec|e2e)\\.ts$/]\n    },\n    { \n      test: /\\.html$/, \n      use: ['raw-loader']\n    }\n  ]\n}\n```\n\n#### Before\n```js\nangular.module(\"my-module\").component(\"my-component\", {\n  templateUrl: \"./myComponent.html\" ,\n  controller: \"MyController\"\n});\n```\n\n#### After (before it is bundled into your webpack'd application)\n```js\nangular.module(\"my-module\").component(\"my-component\", {\n  template: require('/myComponent.html\" ,\n  controller: \"MyController\"\n});\n```\n\n### How does it work\nThe `angular1-templateurl-loader` searches for `templateUrl` declarations inside of the AngularJS files and replaces the paths with the corresponding `require` statement.\nIf `relativeTo: '/some/absolute/path'` is added to the loader's options, ALL templates will loaded in relation to the specified path instead of the current directory.\n\nThe generated `require` statements will be handled by the given loader for `.html` files.\n\n### Common Issues\nIn some cases the webpack compilation will fail due to unknown `require` statements in the source.<br/>\nThis is caused by the [way the template loader works](#how-does-it-work). \n\n> The Typescript transpiler doesn't have any typings for the `require` method, which was generated by the loader.\n\nWe recommend the installation of type defintions, which contain a declaration of the `require` method.\n- [@types/node](https://www.npmjs.com/package/@types/node) | [dt~node](https://github.com/DefinitelyTyped/DefinitelyTyped/blob/master/node/node.d.ts)\n- [@types/requirejs](https://www.npmjs.com/package/@types/requirejs) | [dt~requirejs](https://github.com/DefinitelyTyped/DefinitelyTyped/tree/master/requirejs)\n","maintainers":[{"name":"tm.arun","email":"tm.arunagiri@gmail.com"}],"time":{"modified":"2022-06-13T02:59:54.534Z","created":"2017-05-07T14:49:32.751Z","1.0.0":"2017-05-07T14:49:32.751Z"},"homepage":"https://github.com/tmarun/angular1-templateurl-loader#readme","keywords":["angularjs","webpack","loader"],"repository":{"type":"git","url":"git+https://github.com/tmarun/angular1-templateurl-loader.git"},"author":{"name":"Arunagiri TM"},"bugs":{"url":"https://github.com/tmarun/angular1-templateurl-loader/issues"},"license":"MIT","readmeFilename":"README.md"}