@parcel/packager-svg 2.14.5-canary.3437 → 2.14.5-canary.3442

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.
Files changed (3) hide show
  1. package/lib/SVGPackager.js +84 -102
  2. package/package.json +7 -7
  3. package/src/SVGPackager.js +90 -122
package/lib/SVGPackager.js CHANGED
@@ -18,16 +18,16 @@ function _plugin() {
18
18
  };
19
19
  return data;
20
20
  }
21
- function _posthtml() {
22
- const data = _interopRequireDefault(require("posthtml"));
23
- _posthtml = function () {
21
+ function _utils() {
22
+ const data = require("@parcel/utils");
23
+ _utils = function () {
24
24
  return data;
25
25
  };
26
26
  return data;
27
27
  }
28
- function _utils() {
29
- const data = require("@parcel/utils");
30
- _utils = function () {
28
+ function _rust() {
29
+ const data = require("@parcel/rust");
30
+ _rust = function () {
31
31
  return data;
32
32
  };
33
33
  return data;
@@ -44,116 +44,98 @@ var _default = exports.default = new (_plugin().Packager)({
44
44
  assets.push(asset);
45
45
  });
46
46
  _assert().default.strictEqual(assets.length, 1, 'SVG bundles must only contain one asset');
47
-
48
- // Add bundles in the same bundle group that are not inline. For example, if two inline
49
- // bundles refer to the same library that is extracted into a shared bundle.
50
- let referencedBundles = [...(0, _utils().setDifference)(new Set(bundleGraph.getReferencedBundles(bundle)), new Set(bundleGraph.getReferencedBundles(bundle, {
51
- recursive: false
52
- })))];
53
- const asset = assets[0];
54
- const code = await asset.getCode();
47
+ let asset = assets[0];
48
+ let code = await asset.getBuffer();
55
49
  let {
56
- html: svg
57
- } = await (0, _posthtml().default)([tree => insertBundleReferences(referencedBundles, tree), tree => replaceInlineAssetContent(bundleGraph, getInlineBundleContents, tree)]).process(code, {
58
- directives: [{
59
- name: /^\?/,
60
- start: '<',
61
- end: '>'
62
- }],
63
- xmlMode: true
64
- });
65
- const {
66
- contents,
67
- map
68
- } = (0, _utils().replaceURLReferences)({
69
- bundle,
70
- bundleGraph,
71
- contents: svg,
72
- relative: false,
73
- getReplacement: contents => contents.replace(/"/g, '&quot;')
74
- });
75
- return (0, _utils().replaceInlineReferences)({
76
- bundle,
77
- bundleGraph,
78
- contents,
79
- getInlineBundleContents,
80
- getInlineReplacement: (dep, inlineType, contents) => ({
81
- from: dep.id,
82
- to: contents.replace(/"/g, '&quot;').trim()
83
- }),
84
- map
50
+ bundles,
51
+ importMap
52
+ } = getBundleReferences(bundleGraph, bundle);
53
+ let inlineBundles = await getInlineBundles(bundleGraph, bundle, getInlineBundleContents);
54
+ let res = (0, _rust().packageSvg)({
55
+ code,
56
+ xml: true,
57
+ bundles,
58
+ inlineBundles,
59
+ importMap
85
60
  });
61
+ return {
62
+ contents: res.code
63
+ };
86
64
  }
87
65
  });
88
- async function replaceInlineAssetContent(bundleGraph, getInlineBundleContents, tree) {
89
- const inlineNodes = [];
90
- tree.walk(node => {
91
- if (node.attrs && node.attrs['data-parcel-key']) {
92
- inlineNodes.push(node);
66
+ async function getInlineBundles(bundleGraph, bundle, getInlineBundleContents) {
67
+ let inlineBundles = {};
68
+ let dependencies = [];
69
+ bundle.traverse(node => {
70
+ if (node.type === 'dependency') {
71
+ dependencies.push(node.value);
93
72
  }
94
- return node;
95
73
  });
96
- for (const node of inlineNodes) {
97
- const newContent = await getAssetContent(bundleGraph, getInlineBundleContents, node.attrs['data-parcel-key']);
98
- if (newContent === null) {
99
- continue;
100
- }
101
- node.content = await (0, _utils().blobToString)(newContent.contents);
74
+ for (let dependency of dependencies) {
75
+ let entryBundle = bundleGraph.getReferencedBundle(dependency, bundle);
76
+ if ((entryBundle === null || entryBundle === void 0 ? void 0 : entryBundle.bundleBehavior) === 'inline') {
77
+ var _dependency$meta;
78
+ let packagedBundle = await getInlineBundleContents(entryBundle, bundleGraph);
79
+ let packagedContents = await (0, _utils().blobToString)(packagedBundle.contents);
102
80
 
103
- // Wrap scripts and styles with CDATA if needed to ensure characters are not interpreted as XML
104
- if (node.tag === 'script' || node.tag === 'style') {
105
- if (node.content.includes('<') || node.content.includes('&')) {
106
- node.content = node.content.replace(/]]>/g, ']\\]>');
107
- node.content = `<![CDATA[\n${node.content}\n]]>`;
81
+ // Wrap scripts and styles with CDATA if needed to ensure characters are not interpreted as XML
82
+ if (entryBundle.type === 'js' || entryBundle.type === 'css') {
83
+ if (packagedContents.includes('<') || packagedContents.includes('&')) {
84
+ packagedContents = packagedContents.replace(/]]>/g, ']\\]>');
85
+ packagedContents = `<![CDATA[\n${packagedContents}\n]]>`;
86
+ }
108
87
  }
88
+ let placeholder = ((_dependency$meta = dependency.meta) === null || _dependency$meta === void 0 ? void 0 : _dependency$meta.placeholder) ?? dependency.id;
89
+ (0, _assert().default)(typeof placeholder === 'string');
90
+ inlineBundles[placeholder] = {
91
+ contents: packagedContents,
92
+ module: false
93
+ };
94
+ } else if (dependency.specifierType === 'url') {
95
+ var _dependency$meta2;
96
+ let placeholder = ((_dependency$meta2 = dependency.meta) === null || _dependency$meta2 === void 0 ? void 0 : _dependency$meta2.placeholder) ?? dependency.id;
97
+ (0, _assert().default)(typeof placeholder === 'string');
98
+ inlineBundles[placeholder] = {
99
+ contents: entryBundle ? (0, _utils().getURLReplacement)({
100
+ dependency,
101
+ fromBundle: bundle,
102
+ toBundle: entryBundle,
103
+ relative: false
104
+ }).to : dependency.specifier,
105
+ module: false
106
+ };
109
107
  }
110
-
111
- // remove attr from output
112
- delete node.attrs['data-parcel-key'];
113
- }
114
- return tree;
115
- }
116
- async function getAssetContent(bundleGraph, getInlineBundleContents, assetId) {
117
- let inlineBundle;
118
- bundleGraph.traverseBundles((bundle, context, {
119
- stop
120
- }) => {
121
- const entryAssets = bundle.getEntryAssets();
122
- if (entryAssets.some(a => a.uniqueKey === assetId)) {
123
- inlineBundle = bundle;
124
- stop();
125
- }
126
- });
127
- if (!inlineBundle) {
128
- return null;
129
108
  }
130
- const bundleResult = await getInlineBundleContents(inlineBundle, bundleGraph);
131
- return {
132
- bundle: inlineBundle,
133
- contents: bundleResult.contents
134
- };
109
+ return inlineBundles;
135
110
  }
136
- function insertBundleReferences(siblingBundles, tree) {
137
- let scripts = [];
138
- let stylesheets = [];
139
- for (let bundle of siblingBundles) {
140
- if (bundle.type === 'css') {
141
- stylesheets.push(`<?xml-stylesheet href=${JSON.stringify((0, _utils().urlJoin)(bundle.target.publicUrl, bundle.name))}?>`);
142
- } else if (bundle.type === 'js') {
143
- scripts.push({
144
- tag: 'script',
145
- attrs: {
111
+ function getBundleReferences(bundleGraph, htmlBundle) {
112
+ let bundles = [];
113
+ let referencedBundles = new Set(bundleGraph.getReferencedBundles(htmlBundle));
114
+ let nonRecursiveReferencedBundles = new Set(bundleGraph.getReferencedBundles(htmlBundle, {
115
+ recursive: false
116
+ }));
117
+ for (let bundle of referencedBundles) {
118
+ let isDirectlyReferenced = nonRecursiveReferencedBundles.has(bundle);
119
+ if (bundle.type === 'css' && !isDirectlyReferenced) {
120
+ bundles.push({
121
+ type: 'StyleSheet',
122
+ value: {
146
123
  href: (0, _utils().urlJoin)(bundle.target.publicUrl, bundle.name)
147
124
  }
148
125
  });
126
+ } else if (bundle.type === 'js' && !isDirectlyReferenced) {
127
+ bundles.push({
128
+ type: 'Script',
129
+ value: {
130
+ module: false,
131
+ nomodule: false,
132
+ src: (0, _utils().urlJoin)(bundle.target.publicUrl, bundle.name)
133
+ }
134
+ });
149
135
  }
150
136
  }
151
- tree.unshift(...stylesheets);
152
- if (scripts.length > 0) {
153
- tree.match({
154
- tag: 'svg'
155
- }, node => {
156
- node.content.unshift(...scripts);
157
- });
158
- }
137
+ return {
138
+ bundles,
139
+ importMap: {}
140
+ };
159
141
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@parcel/packager-svg",
3
- "version": "2.14.5-canary.3437+40ebdcd87",
3
+ "version": "2.14.5-canary.3442+914335c16",
4
4
  "license": "MIT",
5
5
  "publishConfig": {
6
6
  "access": "public"
@@ -17,13 +17,13 @@
17
17
  "source": "src/SVGPackager.js",
18
18
  "engines": {
19
19
  "node": ">= 16.0.0",
20
- "parcel": "^2.0.0-canary.1812+40ebdcd87"
20
+ "parcel": "^2.0.0-canary.1817+914335c16"
21
21
  },
22
22
  "dependencies": {
23
- "@parcel/plugin": "2.0.0-canary.1814+40ebdcd87",
24
- "@parcel/types": "2.0.0-canary.1814+40ebdcd87",
25
- "@parcel/utils": "2.0.0-canary.1814+40ebdcd87",
26
- "posthtml": "^0.16.4"
23
+ "@parcel/plugin": "2.0.0-canary.1819+914335c16",
24
+ "@parcel/rust": "2.14.5-canary.3442+914335c16",
25
+ "@parcel/types": "2.0.0-canary.1819+914335c16",
26
+ "@parcel/utils": "2.0.0-canary.1819+914335c16"
27
27
  },
28
- "gitHead": "40ebdcd87a4bb51df3b060a05aad005595de8558"
28
+ "gitHead": "914335c16417ca54c31cda5875000fd5ea7c26a6"
29
29
  }
package/src/SVGPackager.js CHANGED
@@ -1,16 +1,15 @@
1
1
  // @flow
2
2
 
3
- import type {Bundle, BundleGraph, NamedBundle} from '@parcel/types';
3
+ import type {BundleGraph, NamedBundle} from '@parcel/types';
4
4
  import assert from 'assert';
5
5
  import {Packager} from '@parcel/plugin';
6
- import posthtml from 'posthtml';
6
+ import {blobToString, urlJoin, getURLReplacement} from '@parcel/utils';
7
7
  import {
8
- blobToString,
9
- replaceInlineReferences,
10
- replaceURLReferences,
11
- urlJoin,
12
- setDifference,
13
- } from '@parcel/utils';
8
+ packageSvg,
9
+ type HtmlBundleReference,
10
+ type HtmlInlineBundle,
11
+ } from '@parcel/rust';
12
+ import invariant from 'assert';
14
13
 
15
14
  export default (new Packager({
16
15
  async package({bundle, bundleGraph, getInlineBundleContents}) {
@@ -25,145 +24,114 @@ export default (new Packager({
25
24
  'SVG bundles must only contain one asset',
26
25
  );
27
26
 
28
- // Add bundles in the same bundle group that are not inline. For example, if two inline
29
- // bundles refer to the same library that is extracted into a shared bundle.
30
- let referencedBundles = [
31
- ...setDifference(
32
- new Set(bundleGraph.getReferencedBundles(bundle)),
33
- new Set(bundleGraph.getReferencedBundles(bundle, {recursive: false})),
34
- ),
35
- ];
36
-
37
- const asset = assets[0];
38
- const code = await asset.getCode();
39
- const options = {
40
- directives: [
41
- {
42
- name: /^\?/,
43
- start: '<',
44
- end: '>',
45
- },
46
- ],
47
- xmlMode: true,
48
- };
49
-
50
- let {html: svg} = await posthtml([
51
- tree => insertBundleReferences(referencedBundles, tree),
52
- tree =>
53
- replaceInlineAssetContent(bundleGraph, getInlineBundleContents, tree),
54
- ]).process(code, options);
27
+ let asset = assets[0];
28
+ let code = await asset.getBuffer();
55
29
 
56
- const {contents, map} = replaceURLReferences({
57
- bundle,
30
+ let {bundles, importMap} = getBundleReferences(bundleGraph, bundle);
31
+ let inlineBundles = await getInlineBundles(
58
32
  bundleGraph,
59
- contents: svg,
60
- relative: false,
61
- getReplacement: contents => contents.replace(/"/g, '&quot;'),
62
- });
63
-
64
- return replaceInlineReferences({
65
33
  bundle,
66
- bundleGraph,
67
- contents,
68
34
  getInlineBundleContents,
69
- getInlineReplacement: (dep, inlineType, contents) => ({
70
- from: dep.id,
71
- to: contents.replace(/"/g, '&quot;').trim(),
72
- }),
73
- map,
35
+ );
36
+
37
+ let res = packageSvg({
38
+ code,
39
+ xml: true,
40
+ bundles,
41
+ inlineBundles,
42
+ importMap,
74
43
  });
44
+
45
+ return {contents: res.code};
75
46
  },
76
47
  }): Packager);
77
48
 
78
- async function replaceInlineAssetContent(
49
+ async function getInlineBundles(
79
50
  bundleGraph: BundleGraph<NamedBundle>,
51
+ bundle: NamedBundle,
80
52
  getInlineBundleContents,
81
- tree,
82
53
  ) {
83
- const inlineNodes = [];
84
- tree.walk(node => {
85
- if (node.attrs && node.attrs['data-parcel-key']) {
86
- inlineNodes.push(node);
87
- }
88
- return node;
89
- });
54
+ let inlineBundles: {|[string]: HtmlInlineBundle|} = {};
90
55
 
91
- for (const node of inlineNodes) {
92
- const newContent = await getAssetContent(
93
- bundleGraph,
94
- getInlineBundleContents,
95
- node.attrs['data-parcel-key'],
96
- );
97
-
98
- if (newContent === null) {
99
- continue;
56
+ let dependencies = [];
57
+ bundle.traverse(node => {
58
+ if (node.type === 'dependency') {
59
+ dependencies.push(node.value);
100
60
  }
61
+ });
101
62
 
102
- node.content = await blobToString(newContent.contents);
103
-
104
- // Wrap scripts and styles with CDATA if needed to ensure characters are not interpreted as XML
105
- if (node.tag === 'script' || node.tag === 'style') {
106
- if (node.content.includes('<') || node.content.includes('&')) {
107
- node.content = node.content.replace(/]]>/g, ']\\]>');
108
- node.content = `<![CDATA[\n${node.content}\n]]>`;
63
+ for (let dependency of dependencies) {
64
+ let entryBundle = bundleGraph.getReferencedBundle(dependency, bundle);
65
+ if (entryBundle?.bundleBehavior === 'inline') {
66
+ let packagedBundle = await getInlineBundleContents(
67
+ entryBundle,
68
+ bundleGraph,
69
+ );
70
+ let packagedContents = await blobToString(packagedBundle.contents);
71
+
72
+ // Wrap scripts and styles with CDATA if needed to ensure characters are not interpreted as XML
73
+ if (entryBundle.type === 'js' || entryBundle.type === 'css') {
74
+ if (packagedContents.includes('<') || packagedContents.includes('&')) {
75
+ packagedContents = packagedContents.replace(/]]>/g, ']\\]>');
76
+ packagedContents = `<![CDATA[\n${packagedContents}\n]]>`;
77
+ }
109
78
  }
110
- }
111
-
112
- // remove attr from output
113
- delete node.attrs['data-parcel-key'];
114
- }
115
-
116
- return tree;
117
- }
118
79
 
119
- async function getAssetContent(
120
- bundleGraph: BundleGraph<NamedBundle>,
121
- getInlineBundleContents,
122
- assetId,
123
- ) {
124
- let inlineBundle: ?Bundle;
125
- bundleGraph.traverseBundles((bundle, context, {stop}) => {
126
- const entryAssets = bundle.getEntryAssets();
127
- if (entryAssets.some(a => a.uniqueKey === assetId)) {
128
- inlineBundle = bundle;
129
- stop();
80
+ let placeholder = dependency.meta?.placeholder ?? dependency.id;
81
+ invariant(typeof placeholder === 'string');
82
+ inlineBundles[placeholder] = {
83
+ contents: packagedContents,
84
+ module: false,
85
+ };
86
+ } else if (dependency.specifierType === 'url') {
87
+ let placeholder = dependency.meta?.placeholder ?? dependency.id;
88
+ invariant(typeof placeholder === 'string');
89
+ inlineBundles[placeholder] = {
90
+ contents: entryBundle
91
+ ? getURLReplacement({
92
+ dependency,
93
+ fromBundle: bundle,
94
+ toBundle: entryBundle,
95
+ relative: false,
96
+ }).to
97
+ : dependency.specifier,
98
+ module: false,
99
+ };
130
100
  }
131
- });
132
-
133
- if (!inlineBundle) {
134
- return null;
135
101
  }
136
102
 
137
- const bundleResult = await getInlineBundleContents(inlineBundle, bundleGraph);
138
-
139
- return {bundle: inlineBundle, contents: bundleResult.contents};
103
+ return inlineBundles;
140
104
  }
141
105
 
142
- function insertBundleReferences(siblingBundles, tree) {
143
- let scripts = [];
144
- let stylesheets = [];
145
-
146
- for (let bundle of siblingBundles) {
147
- if (bundle.type === 'css') {
148
- stylesheets.push(
149
- `<?xml-stylesheet href=${JSON.stringify(
150
- urlJoin(bundle.target.publicUrl, bundle.name),
151
- )}?>`,
152
- );
153
- } else if (bundle.type === 'js') {
154
- scripts.push({
155
- tag: 'script',
156
- attrs: {
106
+ function getBundleReferences(bundleGraph, htmlBundle) {
107
+ let bundles: HtmlBundleReference[] = [];
108
+ let importMap = {};
109
+
110
+ let referencedBundles = new Set(bundleGraph.getReferencedBundles(htmlBundle));
111
+ let nonRecursiveReferencedBundles = new Set(
112
+ bundleGraph.getReferencedBundles(htmlBundle, {recursive: false}),
113
+ );
114
+
115
+ for (let bundle of referencedBundles) {
116
+ let isDirectlyReferenced = nonRecursiveReferencedBundles.has(bundle);
117
+ if (bundle.type === 'css' && !isDirectlyReferenced) {
118
+ bundles.push({
119
+ type: 'StyleSheet',
120
+ value: {
157
121
  href: urlJoin(bundle.target.publicUrl, bundle.name),
158
122
  },
159
123
  });
124
+ } else if (bundle.type === 'js' && !isDirectlyReferenced) {
125
+ bundles.push({
126
+ type: 'Script',
127
+ value: {
128
+ module: false,
129
+ nomodule: false,
130
+ src: urlJoin(bundle.target.publicUrl, bundle.name),
131
+ },
132
+ });
160
133
  }
161
134
  }
162
135
 
163
- tree.unshift(...stylesheets);
164
- if (scripts.length > 0) {
165
- tree.match({tag: 'svg'}, node => {
166
- node.content.unshift(...scripts);
167
- });
168
- }
136
+ return {bundles, importMap};
169
137
  }