@vue/component-compiler-utils - npm Package Compare versions

Comparing version 3.1.2 to 3.2.0

CHANGELOG.md

@@ -0,1 +1,10 @@
+# [3.2.0](https://github.com/vuejs/component-compiler-utils/compare/v3.1.2...v3.2.0) (2020-07-22)
+
+
+### Features
+
+* asset handling for support vite dev. ([#90](https://github.com/vuejs/component-compiler-utils/issues/90)) ([ad83bdf](https://github.com/vuejs/component-compiler-utils/commit/ad83bdfc7eb6f33fd46eb85071125406a85d0545))
+
+
+
 ## [3.1.2](https://github.com/vuejs/component-compiler-utils/compare/v3.1.1...v3.1.2) (2020-04-08)
@@ -9,4 +18,7 @@
 
+### Others
 
+* make prettier dependency optional ([aea1b79](https://github.com/vuejs/component-compiler-utils/commit/aea1b79)), closes [#84](https://github.com/vuejs/component-compiler-utils/issues/84)
 
+
 ## [3.1.1](https://github.com/vuejs/component-compiler-utils/compare/v3.1.0...v3.1.1) (2020-01-06)
@@ -13,0 +25,0 @@

dist/compileStyle.js

@@ -6,2 +6,3 @@ "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.doCompileStyle = exports.compileStyleAsync = exports.compileStyle = void 0;
 const postcss = require('postcss');
@@ -8,0 +9,0 @@ const trim_1 = __importDefault(require("./stylePlugins/trim"));

dist/compileTemplate.d.ts

 import { VueTemplateCompiler, VueTemplateCompilerOptions, ErrorWithRange } from './types';
-import { AssetURLOptions } from './templateCompilerModules/assetUrl';
+import { AssetURLOptions, TransformAssetUrlsOptions } from './templateCompilerModules/assetUrl';
 export interface TemplateCompileOptions {
@@ -9,2 +9,3 @@ source: string;
     transformAssetUrls?: AssetURLOptions | boolean;
+    transformAssetUrlsOptions?: TransformAssetUrlsOptions;
     preprocessLang?: string;
@@ -11,0 +12,0 @@ preprocessOptions?: any;

dist/compileTemplate.js

@@ -6,2 +6,3 @@ "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.compileTemplate = void 0;
 const assetUrl_1 = __importDefault(require("./templateCompilerModules/assetUrl"));
@@ -57,3 +58,3 @@ const srcset_1 = __importDefault(require("./templateCompilerModules/srcset"));
 function actuallyCompile(options) {
-    const { source, compiler, compilerOptions = {}, transpileOptions = {}, transformAssetUrls, isProduction = process.env.NODE_ENV === 'production', isFunctional = false, optimizeSSR = false, prettify = true } = options;
+    const { source, compiler, compilerOptions = {}, transpileOptions = {}, transformAssetUrls, transformAssetUrlsOptions, isProduction = process.env.NODE_ENV === 'production', isFunctional = false, optimizeSSR = false, prettify = true } = options;
     const compile = optimizeSSR && compiler.ssrCompile ? compiler.ssrCompile : compiler.compile;
@@ -64,5 +65,5 @@ let finalCompilerOptions = compilerOptions;
             transformAssetUrls === true
-                ? assetUrl_1.default()
-                : assetUrl_1.default(transformAssetUrls),
-            srcset_1.default()
+                ? assetUrl_1.default(undefined, transformAssetUrlsOptions)
+                : assetUrl_1.default(transformAssetUrls, transformAssetUrlsOptions),
+            srcset_1.default(transformAssetUrlsOptions)
         ];
@@ -69,0 +70,0 @@ finalCompilerOptions = Object.assign({}, compilerOptions, {

dist/index.js

 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.compileStyleAsync = exports.compileStyle = exports.compileTemplate = exports.parse = void 0;
 const parse_1 = require("./parse");
-exports.parse = parse_1.parse;
+Object.defineProperty(exports, "parse", { enumerable: true, get: function () { return parse_1.parse; } });
 const compileTemplate_1 = require("./compileTemplate");
-exports.compileTemplate = compileTemplate_1.compileTemplate;
+Object.defineProperty(exports, "compileTemplate", { enumerable: true, get: function () { return compileTemplate_1.compileTemplate; } });
 const compileStyle_1 = require("./compileStyle");
-exports.compileStyle = compileStyle_1.compileStyle;
-exports.compileStyleAsync = compileStyle_1.compileStyleAsync;
+Object.defineProperty(exports, "compileStyle", { enumerable: true, get: function () { return compileStyle_1.compileStyle; } });
+Object.defineProperty(exports, "compileStyleAsync", { enumerable: true, get: function () { return compileStyle_1.compileStyleAsync; } });

dist/parse.js

 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.parse = void 0;
 const source_map_1 = require("source-map");
@@ -4,0 +5,0 @@ const hash = require('hash-sum');

dist/stylePlugins/scoped.js

 "use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
 var __importStar = (this && this.__importStar) || function (mod) {
     if (mod && mod.__esModule) return mod;
     var result = {};
-    if (mod != null) for (var k in mod) if (Object.hasOwnProperty.call(mod, k)) result[k] = mod[k];
-    result["default"] = mod;
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
     return result;
@@ -8,0 +20,0 @@ };

dist/stylePlugins/trim.js

 "use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    Object.defineProperty(o, k2, { enumerable: true, get: function() { return m[k]; } });
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
 var __importStar = (this && this.__importStar) || function (mod) {
     if (mod && mod.__esModule) return mod;
     var result = {};
-    if (mod != null) for (var k in mod) if (Object.hasOwnProperty.call(mod, k)) result[k] = mod[k];
-    result["default"] = mod;
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
     return result;
@@ -8,0 +20,0 @@ };

dist/styleProcessors/index.js

 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.processors = void 0;
 const merge = require('merge-source-map');
@@ -4,0 +5,0 @@ // .scss/.sass processor

dist/templateCompilerModules/assetUrl.d.ts

@@ -5,5 +5,12 @@ import { ASTNode } from './utils';
 }
-declare const _default: (userOptions?: AssetURLOptions | undefined) => {
+export interface TransformAssetUrlsOptions {
+    /**
+     * If base is provided, instead of transforming relative asset urls into
+     * imports, they will be directly rewritten to absolute urls.
+     */
+    base?: string;
+}
+declare const _default: (userOptions?: AssetURLOptions | undefined, transformAssetUrlsOption?: TransformAssetUrlsOptions | undefined) => {
     postTransformNode: (node: ASTNode) => void;
 };
 export default _default;

dist/templateCompilerModules/assetUrl.js

@@ -13,3 +13,3 @@ "use strict";
 };
-exports.default = (userOptions) => {
+exports.default = (userOptions, transformAssetUrlsOption) => {
     const options = userOptions
@@ -20,7 +20,7 @@ ? Object.assign({}, defaultOptions, userOptions)
         postTransformNode: (node) => {
-            transform(node, options);
+            transform(node, options, transformAssetUrlsOption);
         }
     };
 };
-function transform(node, options) {
+function transform(node, options, transformAssetUrlsOption) {
     for (const tag in options) {
@@ -30,6 +30,6 @@ if ((tag === '*' || node.tag === tag) && node.attrs) {
             if (typeof attributes === 'string') {
-                node.attrs.some(attr => rewrite(attr, attributes));
+                node.attrs.some(attr => rewrite(attr, attributes, transformAssetUrlsOption));
             }
             else if (Array.isArray(attributes)) {
-                attributes.forEach(item => node.attrs.some(attr => rewrite(attr, item)));
+                attributes.forEach(item => node.attrs.some(attr => rewrite(attr, item, transformAssetUrlsOption)));
             }
@@ -39,3 +39,3 @@ }
 }
-function rewrite(attr, name) {
+function rewrite(attr, name, transformAssetUrlsOption) {
     if (attr.name === name) {
@@ -45,3 +45,3 @@ const value = attr.value;
         if (value.charAt(0) === '"' && value.charAt(value.length - 1) === '"') {
-            attr.value = utils_1.urlToRequire(value.slice(1, -1));
+            attr.value = utils_1.urlToRequire(value.slice(1, -1), transformAssetUrlsOption);
             return true;
@@ -48,0 +48,0 @@ }

dist/templateCompilerModules/srcset.d.ts

 import { ASTNode } from './utils';
-declare const _default: () => {
+import { TransformAssetUrlsOptions } from './assetUrl';
+declare const _default: (transformAssetUrlsOptions?: TransformAssetUrlsOptions | undefined) => {
     postTransformNode: (node: ASTNode) => void;
 };
 export default _default;

dist/templateCompilerModules/srcset.js

@@ -5,5 +5,5 @@ "use strict";
 const utils_1 = require("./utils");
-exports.default = () => ({
+exports.default = (transformAssetUrlsOptions) => ({
     postTransformNode: (node) => {
-        transform(node);
+        transform(node, transformAssetUrlsOptions);
     }
@@ -13,3 +13,3 @@ });
 const escapedSpaceCharacters = /( |\\t|\\n|\\f|\\r)+/g;
-function transform(node) {
+function transform(node, transformAssetUrlsOptions) {
     const tags = ['img', 'source'];
@@ -35,3 +35,6 @@ if (tags.indexOf(node.tag) !== -1 && node.attrs) {
                         .split(' ', 2);
-                    return { require: utils_1.urlToRequire(url), descriptor };
+                    return {
+                        require: utils_1.urlToRequire(url, transformAssetUrlsOptions),
+                        descriptor
+                    };
                 });
@@ -38,0 +41,0 @@ // "require(url1)"

dist/templateCompilerModules/utils.d.ts

@@ -0,1 +1,2 @@
+import { TransformAssetUrlsOptions } from './assetUrl';
 export interface Attr {
@@ -9,2 +10,2 @@ name: string;
 }
-export declare function urlToRequire(url: string): string;
+export declare function urlToRequire(url: string, transformAssetUrlsOption?: TransformAssetUrlsOptions): string;

dist/templateCompilerModules/utils.js

 "use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
 Object.defineProperty(exports, "__esModule", { value: true });
+exports.urlToRequire = void 0;
 const url_1 = require("url");
-function urlToRequire(url) {
+const path_1 = __importDefault(require("path"));
+function urlToRequire(url, transformAssetUrlsOption = {}) {
     const returnValue = `"${url}"`;
     // same logic as in transform-require.js
     const firstChar = url.charAt(0);
+    if (firstChar === '~') {
+        const secondChar = url.charAt(1);
+        url = url.slice(secondChar === '/' ? 2 : 1);
+    }
+    const uriParts = parseUriParts(url);
+    if (transformAssetUrlsOption.base) {
+        // explicit base - directly rewrite the url into absolute url
+        // does not apply to absolute urls or urls that start with `@`
+        // since they are aliases
+        if (firstChar === '.' || firstChar === '~') {
+            // when packaged in the browser, path will be using the posix-
+            // only version provided by rollup-plugin-node-builtins.
+            return `"${(path_1.default.posix || path_1.default).join(transformAssetUrlsOption.base, uriParts.path + (uriParts.hash || ''))}"`;
+        }
+        return returnValue;
+    }
     if (firstChar === '.' || firstChar === '~' || firstChar === '@') {
-        if (firstChar === '~') {
-            const secondChar = url.charAt(1);
-            url = url.slice(secondChar === '/' ? 2 : 1);
-        }
-        const uriParts = parseUriParts(url);
         if (!uriParts.hash) {
@@ -15,0 +31,0 @@ return `require("${url}")`;

lib/compileTemplate.ts

@@ -8,3 +8,4 @@ import {
 import assetUrlsModule, {
-  AssetURLOptions
+  AssetURLOptions,
+  TransformAssetUrlsOptions
 } from './templateCompilerModules/assetUrl'
@@ -22,2 +23,3 @@ import srcsetModule from './templateCompilerModules/srcset'
   transformAssetUrls?: AssetURLOptions | boolean
+  transformAssetUrlsOptions?: TransformAssetUrlsOptions
   preprocessLang?: string
@@ -108,2 +110,3 @@ preprocessOptions?: any
     transformAssetUrls,
+    transformAssetUrlsOptions,
     isProduction = process.env.NODE_ENV === 'production',
@@ -122,5 +125,5 @@ isFunctional = false,
       transformAssetUrls === true
-        ? assetUrlsModule()
-        : assetUrlsModule(transformAssetUrls),
-      srcsetModule()
+        ? assetUrlsModule(undefined, transformAssetUrlsOptions)
+        : assetUrlsModule(transformAssetUrls, transformAssetUrlsOptions),
+      srcsetModule(transformAssetUrlsOptions)
     ]
@@ -127,0 +130,0 @@ finalCompilerOptions = Object.assign({}, compilerOptions, {

lib/templateCompilerModules/assetUrl.ts

@@ -9,2 +9,10 @@ // vue compiler module for transforming `<tag>:<attribute>` to `require`
 
+export interface TransformAssetUrlsOptions {
+  /**
+   * If base is provided, instead of transforming relative asset urls into
+   * imports, they will be directly rewritten to absolute urls.
+   */
+  base?: string
+}
+
 const defaultOptions: AssetURLOptions = {
@@ -19,3 +27,6 @@ audio: 'src',
 
-export default (userOptions?: AssetURLOptions) => {
+export default (
+  userOptions?: AssetURLOptions,
+  transformAssetUrlsOption?: TransformAssetUrlsOptions
+) => {
   const options = userOptions
@@ -27,3 +38,3 @@ ? Object.assign({}, defaultOptions, userOptions)
     postTransformNode: (node: ASTNode) => {
-      transform(node, options)
+      transform(node, options, transformAssetUrlsOption)
     }
@@ -33,3 +44,7 @@ }
 
-function transform(node: ASTNode, options: AssetURLOptions) {
+function transform(
+  node: ASTNode,
+  options: AssetURLOptions,
+  transformAssetUrlsOption?: TransformAssetUrlsOptions
+) {
   for (const tag in options) {
@@ -39,5 +54,9 @@ if ((tag === '*' || node.tag === tag) && node.attrs) {
       if (typeof attributes === 'string') {
-        node.attrs.some(attr => rewrite(attr, attributes))
+        node.attrs.some(attr =>
+          rewrite(attr, attributes, transformAssetUrlsOption)
+        )
       } else if (Array.isArray(attributes)) {
-        attributes.forEach(item => node.attrs.some(attr => rewrite(attr, item)))
+        attributes.forEach(item =>
+          node.attrs.some(attr => rewrite(attr, item, transformAssetUrlsOption))
+        )
       }
@@ -48,3 +67,7 @@ }
 
-function rewrite(attr: Attr, name: string) {
+function rewrite(
+  attr: Attr,
+  name: string,
+  transformAssetUrlsOption?: TransformAssetUrlsOptions
+) {
   if (attr.name === name) {
@@ -54,3 +77,3 @@ const value = attr.value
     if (value.charAt(0) === '"' && value.charAt(value.length - 1) === '"') {
-      attr.value = urlToRequire(value.slice(1, -1))
+      attr.value = urlToRequire(value.slice(1, -1), transformAssetUrlsOption)
       return true
@@ -57,0 +80,0 @@ }

lib/templateCompilerModules/srcset.ts

 // vue compiler module for transforming `img:srcset` to a number of `require`s
 
 import { urlToRequire, ASTNode } from './utils'
+import { TransformAssetUrlsOptions } from './assetUrl'
 
@@ -10,5 +11,5 @@ interface ImageCandidate {
 
-export default () => ({
+export default (transformAssetUrlsOptions?: TransformAssetUrlsOptions) => ({
   postTransformNode: (node: ASTNode) => {
-    transform(node)
+    transform(node, transformAssetUrlsOptions)
   }
@@ -20,3 +21,6 @@ })
 
-function transform(node: ASTNode) {
+function transform(
+  node: ASTNode,
+  transformAssetUrlsOptions?: TransformAssetUrlsOptions
+) {
   const tags = ['img', 'source']
@@ -45,3 +49,6 @@
               .split(' ', 2)
-            return { require: urlToRequire(url), descriptor }
+            return {
+              require: urlToRequire(url, transformAssetUrlsOptions),
+              descriptor
+            }
           })
@@ -48,0 +55,0 @@

lib/templateCompilerModules/utils.ts

@@ -0,1 +1,5 @@
+import { TransformAssetUrlsOptions } from './assetUrl'
+import { UrlWithStringQuery, parse as uriParse } from 'url'
+import path from 'path'
+
 export interface Attr {
@@ -11,16 +15,32 @@ name: string
 
-import { UrlWithStringQuery, parse as uriParse } from 'url'
-
-export function urlToRequire(url: string): string {
+export function urlToRequire(
+  url: string,
+  transformAssetUrlsOption: TransformAssetUrlsOptions = {}
+): string {
   const returnValue = `"${url}"`
   // same logic as in transform-require.js
   const firstChar = url.charAt(0)
-  if (firstChar === '.' || firstChar === '~' || firstChar === '@') {
-    if (firstChar === '~') {
-      const secondChar = url.charAt(1)
-      url = url.slice(secondChar === '/' ? 2 : 1)
+  if (firstChar === '~') {
+    const secondChar = url.charAt(1)
+    url = url.slice(secondChar === '/' ? 2 : 1)
+  }
+
+  const uriParts = parseUriParts(url)
+
+  if (transformAssetUrlsOption.base) {
+    // explicit base - directly rewrite the url into absolute url
+    // does not apply to absolute urls or urls that start with `@`
+    // since they are aliases
+    if (firstChar === '.' || firstChar === '~') {
+      // when packaged in the browser, path will be using the posix-
+      // only version provided by rollup-plugin-node-builtins.
+      return `"${(path.posix || path).join(
+        transformAssetUrlsOption.base,
+        uriParts.path + (uriParts.hash || '')
+      )}"`
     }
+    return returnValue
+  }
 
-    const uriParts = parseUriParts(url)
-
+  if (firstChar === '.' || firstChar === '~' || firstChar === '@') {
     if (!uriParts.hash) {
@@ -27,0 +47,0 @@ return `require("${url}")`

package.json

 {
   "name": "@vue/component-compiler-utils",
-  "version": "3.1.2",
+  "version": "3.2.0",
   "description": "Lower level utilities for compiling Vue single file components",
@@ -5,0 +5,0 @@ "main": "dist/index.js",

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

78708

increased by8.04%

Lines of code

1769

increased by6.57%

No dependency changes