diff --git a/src/Asset/index.d.ts b/src/Asset/index.d.ts index 2eb64e0..a44003a 100644 --- a/src/Asset/index.d.ts +++ b/src/Asset/index.d.ts @@ -4,6 +4,7 @@ export class Asset { parse(code: string): any; addDependency(path: string, options: Object): any; addURLDependency(url: string): string; + process(): Promise; name: string; isAstDirty: boolean; @@ -11,4 +12,6 @@ export class Asset { ast: any; options: any; dependencies: Set; + generated: any; + package: any; } diff --git a/src/PugAsset.ts b/src/PugAsset.ts index e44c128..5bb6304 100644 --- a/src/PugAsset.ts +++ b/src/PugAsset.ts @@ -1,8 +1,5 @@ -import url = require('url'); -import path = require('path'); - import { Asset } from './Asset'; -import isURL = require('parcel-bundler/lib/utils/is-url'); +import HTMLAsset = require('parcel-bundler/lib/assets/HTMLAsset'); import load = require('pug-load'); import lexer = require('pug-lexer'); @@ -41,10 +38,14 @@ const ATTRS: Dictionary = { 'iframe', 'embed' ], + srcset: ['img'], href: ['link', 'a'], poster: ['video'] }; +// A regex to detect if a variable is a 'pure' string (no evaluation needed) +const PURE_STRING_REGEX: RegExp = /(^"([^"]+)"$)|(^'([^']+)'$)/g; + export = class PugAsset extends Asset { public type = 'html'; @@ -72,11 +73,11 @@ export = class PugAsset extends Asset { (cNode as Block).nodes.forEach((n: any) => recursiveCollect(n)); } else { if (cNode.filename && cNode.filename !== this.name && !this.dependencies.has(cNode.filename)) { - this.addDependency(cNode.filename, { - name: cNode.filename, - includedInParent: true, - }); - } + this.addDependency(cNode.filename, { + name: cNode.filename, + includedInParent: true, + }); + } } }; @@ -86,14 +87,10 @@ export = class PugAsset extends Asset { for (const attr of node.attrs) { const elements = ATTRS[attr.name]; if (node.type === 'Tag' && elements && elements.indexOf(node.name) > -1) { - let assetPath = attr.val.substring(1, attr.val.length - 1); - assetPath = this.addURLDependency(assetPath); - if (!isURL(assetPath)) { - // Use url.resolve to normalize path for windows - // from \path\to\res.js to /path/to/res.js - assetPath = url.resolve(path.join(this.options.publicURL, assetPath), ''); + if (PURE_STRING_REGEX.test(attr.val)) { + const assetPath = attr.val.substring(1, attr.val.length - 1); + this.addURLDependency(assetPath); } - attr.val = `'${assetPath}'`; } } } @@ -101,6 +98,18 @@ export = class PugAsset extends Asset { }); } + public async process(): Promise { + await super.process(); + + const htmlAsset = new HTMLAsset(this.name, this.package, this.options); + htmlAsset.contents = this.generated.html; + await htmlAsset.process(); + + Object.assign(this, htmlAsset); + + return this.generated; + } + public generate() { const result = generateCode(this.ast, { compileDebug: false, diff --git a/src/modules.d.ts b/src/modules.d.ts index 430ce16..0a3e696 100644 --- a/src/modules.d.ts +++ b/src/modules.d.ts @@ -17,9 +17,15 @@ declare module 'parcel-bundler/lib/Asset' { export = Asset; } -declare module 'parcel-bundler/lib/utils/is-url' { - function isURL(url: string): boolean; - export = isURL; +declare module 'parcel-bundler/lib/assets/HTMLAsset' { + class HTMLAsset { + constructor(name: string, pkg: string, options: any); + + process(): Promise; + + contents: string; + } + export = HTMLAsset; } declare module 'pug-load' { @@ -64,4 +70,3 @@ declare module 'pug-filters' { function runFilter(name: string, str: string, options: any, currentDirectory: string, funcName: string): any; function handleFilters(ast: any, filters?: any): any; } -