@marko/vite 4.0.4 → 4.1.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +15 -0
- package/dist/index.mjs +54 -3
- package/dist/relative-assets-transform.d.ts +2 -0
- package/package.json +4 -4
package/README.md
CHANGED
|
@@ -49,6 +49,21 @@ export default defineConfig({
|
|
|
49
49
|
});
|
|
50
50
|
```
|
|
51
51
|
|
|
52
|
+
# Browser asset references
|
|
53
|
+
|
|
54
|
+
With @marko/vite when a _static relative path_ is used for certain native tag attributes, the relative asset will be imported and processed by Vite.
|
|
55
|
+
|
|
56
|
+
As an example, with the following template, the `logo.svg` will be imported and processed as if it was a `import` at the root of the file.
|
|
57
|
+
|
|
58
|
+
```
|
|
59
|
+
<img src="./logo.svg">
|
|
60
|
+
|
|
61
|
+
// Would produce a Vite processed asset and update the src, eg with the following output
|
|
62
|
+
<img src="/assets/logo-TwEWmgMb.svg">
|
|
63
|
+
```
|
|
64
|
+
|
|
65
|
+
You can see the list of elements and their attributes which are processed [here](./src/relative-assets-transform.ts).
|
|
66
|
+
|
|
52
67
|
# Linked Mode
|
|
53
68
|
|
|
54
69
|
By default this plugin operates in `linked` mode (you can disabled this by passing [`linked: false` as an option](#options.linked)). In `linked` mode the plugin automatically discovers all of the entry `.marko` files while compiling the server, and tells `Vite` which modules to load in the browser.
|
package/dist/index.mjs
CHANGED
|
@@ -545,6 +545,53 @@ function renderAssetsCall(t2, slot) {
|
|
|
545
545
|
);
|
|
546
546
|
}
|
|
547
547
|
|
|
548
|
+
// src/relative-assets-transform.ts
|
|
549
|
+
var attrSrc = /* @__PURE__ */ new Set(["src"]);
|
|
550
|
+
var attrHref = /* @__PURE__ */ new Set(["href"]);
|
|
551
|
+
var assetAttrsByTag = /* @__PURE__ */ new Map([
|
|
552
|
+
["audio", attrSrc],
|
|
553
|
+
["embed", attrSrc],
|
|
554
|
+
["iframe", attrSrc],
|
|
555
|
+
["img", /* @__PURE__ */ new Set(["src", "srcset"])],
|
|
556
|
+
["input", attrSrc],
|
|
557
|
+
["source", attrSrc],
|
|
558
|
+
["track", attrSrc],
|
|
559
|
+
["video", /* @__PURE__ */ new Set(["src", "poster"])],
|
|
560
|
+
["a", attrHref],
|
|
561
|
+
["area", attrHref],
|
|
562
|
+
["link", attrHref],
|
|
563
|
+
["object", /* @__PURE__ */ new Set(["data"])],
|
|
564
|
+
["body", /* @__PURE__ */ new Set(["background"])]
|
|
565
|
+
]);
|
|
566
|
+
function transform(tag, t2) {
|
|
567
|
+
const { name, attributes } = tag.node;
|
|
568
|
+
if (name.type !== "StringLiteral") {
|
|
569
|
+
return;
|
|
570
|
+
}
|
|
571
|
+
const assetAttrs = assetAttrsByTag.get(name.value);
|
|
572
|
+
if (!assetAttrs) {
|
|
573
|
+
return;
|
|
574
|
+
}
|
|
575
|
+
for (const attr of attributes) {
|
|
576
|
+
if (attr.type === "MarkoAttribute" && attr.value.type === "StringLiteral" && assetAttrs.has(attr.name)) {
|
|
577
|
+
const { value } = attr.value;
|
|
578
|
+
if (!(value[0] === "/" || // Ignore absolute paths.
|
|
579
|
+
!/\.[^.]+$/.test(value) || // Ignore paths without a file extension.
|
|
580
|
+
/^[a-z]{2,}:/i.test(value))) {
|
|
581
|
+
const importedId = tag.scope.generateUid(value);
|
|
582
|
+
attr.value = t2.identifier(importedId);
|
|
583
|
+
tag.hub.file.path.unshiftContainer(
|
|
584
|
+
"body",
|
|
585
|
+
t2.importDeclaration(
|
|
586
|
+
[t2.importDefaultSpecifier(t2.identifier(importedId))],
|
|
587
|
+
t2.stringLiteral(value)
|
|
588
|
+
)
|
|
589
|
+
);
|
|
590
|
+
}
|
|
591
|
+
}
|
|
592
|
+
}
|
|
593
|
+
}
|
|
594
|
+
|
|
548
595
|
// src/read-once-persisted-store.ts
|
|
549
596
|
import os from "os";
|
|
550
597
|
import path4 from "path";
|
|
@@ -596,6 +643,7 @@ var POSIX_SEP = "/";
|
|
|
596
643
|
var WINDOWS_SEP = "\\";
|
|
597
644
|
var normalizePath = path5.sep === WINDOWS_SEP ? (id) => id.replace(/\\/g, POSIX_SEP) : (id) => id;
|
|
598
645
|
var virtualFiles = /* @__PURE__ */ new Map();
|
|
646
|
+
var extReg = /\.[^.]+$/;
|
|
599
647
|
var queryReg = /\?marko-[^?]+$/;
|
|
600
648
|
var browserEntryQuery = "?marko-browser-entry";
|
|
601
649
|
var serverEntryQuery = "?marko-server-entry";
|
|
@@ -741,7 +789,8 @@ function markoPlugin(opts = {}) {
|
|
|
741
789
|
registeredTagLib = true;
|
|
742
790
|
compiler.taglib.register("@marko/vite", {
|
|
743
791
|
"<head>": { transformer: render_assets_transform_default },
|
|
744
|
-
"<body>": { transformer: render_assets_transform_default }
|
|
792
|
+
"<body>": { transformer: render_assets_transform_default },
|
|
793
|
+
"<*>": { transformer: transform }
|
|
745
794
|
});
|
|
746
795
|
}
|
|
747
796
|
const optimizeDeps = config.optimizeDeps ??= {};
|
|
@@ -957,8 +1006,10 @@ function markoPlugin(opts = {}) {
|
|
|
957
1006
|
async transform(source, rawId, ssr) {
|
|
958
1007
|
let id = stripVersionAndTimeStamp(rawId);
|
|
959
1008
|
const info = isBuild ? this.getModuleInfo(id) : void 0;
|
|
960
|
-
|
|
961
|
-
|
|
1009
|
+
const arcSourceId = info?.meta.arcSourceId;
|
|
1010
|
+
if (arcSourceId) {
|
|
1011
|
+
const arcFlagSet = info.meta.arcFlagSet;
|
|
1012
|
+
id = arcFlagSet ? arcSourceId.replace(extReg, `[${arcFlagSet.join("+")}]$&`) : arcSourceId;
|
|
962
1013
|
}
|
|
963
1014
|
const isSSR = typeof ssr === "object" ? ssr.ssr : ssr;
|
|
964
1015
|
const query = getMarkoQuery(id);
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@marko/vite",
|
|
3
3
|
"description": "A Marko plugin for Vite",
|
|
4
|
-
"version": "4.
|
|
4
|
+
"version": "4.1.1",
|
|
5
5
|
"author": "Dylan Piercey <dpiercey@ebay.com>",
|
|
6
6
|
"bugs": "https://github.com/marko-js/vite/issues",
|
|
7
7
|
"dependencies": {
|
|
@@ -21,7 +21,7 @@
|
|
|
21
21
|
"@types/babel__core": "^7.20.4",
|
|
22
22
|
"@types/jsdom": "^21.1.5",
|
|
23
23
|
"@types/mocha": "^10.0.4",
|
|
24
|
-
"@types/node": "^20.9.
|
|
24
|
+
"@types/node": "^20.9.1",
|
|
25
25
|
"@types/resolve": "^1.20.5",
|
|
26
26
|
"@types/serve-handler": "^6.1.4",
|
|
27
27
|
"@typescript-eslint/eslint-plugin": "^6.11.0",
|
|
@@ -38,12 +38,12 @@
|
|
|
38
38
|
"mocha": "^10.2.0",
|
|
39
39
|
"mocha-snap": "^5.0.0",
|
|
40
40
|
"nyc": "^15.1.0",
|
|
41
|
-
"playwright": "^1.
|
|
41
|
+
"playwright": "^1.40.0",
|
|
42
42
|
"prettier": "^3.1.0",
|
|
43
43
|
"serve-handler": "^6.1.5",
|
|
44
44
|
"tsx": "^4.1.2",
|
|
45
45
|
"typescript": "^5.2.2",
|
|
46
|
-
"vite": "^5.0.0
|
|
46
|
+
"vite": "^5.0.0"
|
|
47
47
|
},
|
|
48
48
|
"files": [
|
|
49
49
|
"dist",
|