diff --git a/index.js b/index.js index 34580c6..7091cde 100644 --- a/index.js +++ b/index.js @@ -1,36 +1,21 @@ -module.exports = function(source) { - // using: regex, capture groups, and capture group variables. - var templateUrlRegex = new RegExp(/templateUrl:\s*['"](.*?)['"]/gm) - var stylesRegex = new RegExp(/styleUrls:(.*)/) +// using: regex, capture groups, and capture group variables. +var templateUrlRegex = /templateUrl:(.*)$/gm; +var stylesRegex = /styleUrls:(\s*\[[^\]]*?\])/g; +var stringRegex = /(['"])((?:[^\\]\\\1|.)*?)\1/g; - // replace: templateUrl: './path/to/template.html' - // with: template: require('./path/to/template.html') - function replaceHTMLTemplatePathWithRequire(source) { - if (templateUrlRegex.test(source)) { - var newSource = source.replace(templateUrlRegex, "template: require('$1')"); - return newSource; - } - - return source; - } - - // replace: stylesUrl: ['./foo.css', "./baz.css", "./index.component.css"] - // with: styles: [require('./foo.css'), require("./baz.css"), require("./index.component.css")] - function replaceStylesheetPathWithRequire(source) { - var stylesMatch = source.match(stylesRegex); - var styles; - - if ( stylesRegex.test(source) ) { - styles = stylesMatch[0] - .replace(/['"](.*?)['"]/g, "require('$1')") - .replace(/styleUrls/g, 'styles'); - - var newSource = source.replace(stylesRegex, styles); - return newSource; - } - - return source; - } - - return replaceStylesheetPathWithRequire(replaceHTMLTemplatePathWithRequire(source)); +function replaceStringsWithRequires(string) { + return string.replace(stringRegex, "require('$2')"); } + +module.exports = function(source) { + return source.replace(templateUrlRegex, function (match, url) { + // replace: templateUrl: './path/to/template.html' + // with: template: require('./path/to/template.html') + return "template:" + replaceStringsWithRequires(url); + }) + .replace(stylesRegex, function (match, urls) { + // replace: stylesUrl: ['./foo.css', "./baz.css", "./index.component.css"] + // with: styles: [require('./foo.css'), require("./baz.css"), require("./index.component.css")] + return "styles:" + replaceStringsWithRequires(urls); + }); +}; diff --git a/test/fixtures/component_with_multiple_styles.js b/test/fixtures/component_with_multiple_styles.js new file mode 100644 index 0000000..32fa2f7 --- /dev/null +++ b/test/fixtures/component_with_multiple_styles.js @@ -0,0 +1,15 @@ +var test = ` + import {Component} from '@angular/core'; + + @Component({ + selector: 'test-component', + templateUrl: './some/path/to/file.html', + styleUrls: [ + "./app/css/styles.css", + './app/css/more-styles.css' + ] + }) + export class TestComponent {} +`; + +module.exports = test; diff --git a/test/fixtures/component_with_quote_in_urls.js b/test/fixtures/component_with_quote_in_urls.js new file mode 100644 index 0000000..61ed9f9 --- /dev/null +++ b/test/fixtures/component_with_quote_in_urls.js @@ -0,0 +1,12 @@ +var test = String.raw` + import {Component} from '@angular/core'; + + @Component({ + selector: 'test-component', + templateUrl: './some/path/to/file\'.html', + styleUrls: ["./app/css/\"styles\".css\\"] + }) + export class TestComponent {} +`; + +module.exports = test; diff --git a/test/fixtures/index.js b/test/fixtures/index.js index 24bc2f6..852d6cf 100644 --- a/test/fixtures/index.js +++ b/test/fixtures/index.js @@ -1,4 +1,8 @@ var sampleAngular2ComponentSimpleFixture = require('./sample_angular2_component_file_string_simple.js'); +var componentWithQuoteInUrls = require('./component_with_quote_in_urls.js'); +var componentWithMultipleStyles = require('./component_with_multiple_styles.js'); exports.simpleAngular2TestComponentFileStringSimple = sampleAngular2ComponentSimpleFixture; +exports.componentWithQuoteInUrls = componentWithQuoteInUrls; +exports.componentWithMultipleStyles = componentWithMultipleStyles; diff --git a/test/loader.spec.js b/test/loader.spec.js index d77db36..66b0004 100644 --- a/test/loader.spec.js +++ b/test/loader.spec.js @@ -23,6 +23,47 @@ describe("loader", function() { }); + it("Should convert html and style file strings to require()s regardless of inner quotes", function(){ + + loader.call({}, fixtures.componentWithQuoteInUrls) + .should + .be + .eql(String.raw` + import {Component} from '@angular/core'; + + @Component({ + selector: 'test-component', + template: require('./some/path/to/file\'.html'), + styles: [require('./app/css/\"styles\".css\\')] + }) + export class TestComponent {} +` + ) + + }); + + it("Should convert html and multiple style file strings to require()s", function(){ + + loader.call({}, fixtures.componentWithMultipleStyles) + .should + .be + .eql(` + import {Component} from '@angular/core'; + + @Component({ + selector: 'test-component', + template: require('./some/path/to/file.html'), + styles: [ + require('./app/css/styles.css'), + require('./app/css/more-styles.css') + ] + }) + export class TestComponent {} +` + ) + + }); + it("Should return original source if there are no matches", function() { loader.call({}, 'foo') .should