@compiled/parcel-transformer 0.14.6 → 0.15.0
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/dist/index.js +51 -40
- package/dist/index.js.map +1 -1
- package/package.json +5 -3
- package/src/__tests__/transformer.parceltest.ts +72 -8
- package/src/index.ts +51 -40
package/dist/index.js
CHANGED
|
@@ -9,7 +9,9 @@ const generator_1 = __importDefault(require("@babel/generator"));
|
|
|
9
9
|
const utils_1 = require("@compiled/utils");
|
|
10
10
|
const plugin_1 = require("@parcel/plugin");
|
|
11
11
|
const source_map_1 = __importDefault(require("@parcel/source-map"));
|
|
12
|
-
|
|
12
|
+
// @ts-expect-error missing type
|
|
13
|
+
const utils_2 = require("@parcel/utils");
|
|
14
|
+
const utils_3 = require("./utils");
|
|
13
15
|
const configFiles = [
|
|
14
16
|
'.compiledcssrc',
|
|
15
17
|
'.compiledcssrc.json',
|
|
@@ -57,7 +59,7 @@ exports.default = new plugin_1.Transformer({
|
|
|
57
59
|
return false;
|
|
58
60
|
},
|
|
59
61
|
async parse({ asset, config, options }) {
|
|
60
|
-
var _a, _b;
|
|
62
|
+
var _a, _b, _c, _d;
|
|
61
63
|
// Disable stylesheet extraction locally due to https://github.com/atlassian-labs/compiled/issues/1306
|
|
62
64
|
const extract = config.extract && options.mode !== 'development';
|
|
63
65
|
if (!asset.isSource && !extract) {
|
|
@@ -65,7 +67,8 @@ exports.default = new plugin_1.Transformer({
|
|
|
65
67
|
return undefined;
|
|
66
68
|
}
|
|
67
69
|
const code = await asset.getCode();
|
|
68
|
-
if (code.indexOf('@compiled/react') === -1
|
|
70
|
+
if (code.indexOf('@compiled/react') === -1 &&
|
|
71
|
+
((_b = (_a = config.importSources) === null || _a === void 0 ? void 0 : _a.every((importSource) => !code.includes(importSource))) !== null && _b !== void 0 ? _b : true)) {
|
|
69
72
|
// We only want to parse files that are actually using Compiled.
|
|
70
73
|
// For everything else we bail out.
|
|
71
74
|
return undefined;
|
|
@@ -75,9 +78,9 @@ exports.default = new plugin_1.Transformer({
|
|
|
75
78
|
caller: { name: 'compiled' },
|
|
76
79
|
rootMode: 'upward-optional',
|
|
77
80
|
parserOpts: {
|
|
78
|
-
plugins: (
|
|
81
|
+
plugins: (_c = config.parserBabelPlugins) !== null && _c !== void 0 ? _c : undefined,
|
|
79
82
|
},
|
|
80
|
-
plugins: (
|
|
83
|
+
plugins: (_d = config.transformerBabelPlugins) !== null && _d !== void 0 ? _d : undefined,
|
|
81
84
|
});
|
|
82
85
|
return {
|
|
83
86
|
type: 'babel',
|
|
@@ -87,23 +90,6 @@ exports.default = new plugin_1.Transformer({
|
|
|
87
90
|
},
|
|
88
91
|
async transform({ asset, config, options }) {
|
|
89
92
|
var _a, _b, _c, _d, _e;
|
|
90
|
-
const distStyleRules = [];
|
|
91
|
-
let someCode = await asset.getCode();
|
|
92
|
-
for (const match of someCode.matchAll(/(import ['"](?<importSpec>.+\.compiled\.css)['"];)|(require\(['"](?<requireSpec>.+\.compiled\.css)['"]\);)/g)) {
|
|
93
|
-
const specifierPath = ((_a = match.groups) === null || _a === void 0 ? void 0 : _a.importSpec) || ((_b = match.groups) === null || _b === void 0 ? void 0 : _b.requireSpec);
|
|
94
|
-
if (!specifierPath)
|
|
95
|
-
continue;
|
|
96
|
-
someCode = someCode.replace(match[0], '');
|
|
97
|
-
asset.setCode(someCode);
|
|
98
|
-
const cssFilePath = (0, path_1.isAbsolute)(specifierPath)
|
|
99
|
-
? specifierPath
|
|
100
|
-
: (0, path_1.join)((0, path_1.dirname)(asset.filePath), specifierPath);
|
|
101
|
-
const cssContent = (await asset.fs.readFile(cssFilePath)).toString().split('\n');
|
|
102
|
-
if (!asset.meta.styleRules) {
|
|
103
|
-
asset.meta.styleRules = [];
|
|
104
|
-
}
|
|
105
|
-
asset.meta.styleRules.push(...cssContent);
|
|
106
|
-
}
|
|
107
93
|
const ast = await asset.getAST();
|
|
108
94
|
if (!ast) {
|
|
109
95
|
// We will only receive ASTs for assets we're interested in.
|
|
@@ -115,20 +101,21 @@ exports.default = new plugin_1.Transformer({
|
|
|
115
101
|
const includedFiles = [];
|
|
116
102
|
const code = asset.isASTDirty() ? undefined : await asset.getCode();
|
|
117
103
|
const result = await (0, core_1.transformFromAstAsync)(ast.program, code, {
|
|
118
|
-
code:
|
|
119
|
-
ast:
|
|
104
|
+
code: false,
|
|
105
|
+
ast: true,
|
|
120
106
|
filename: asset.filePath,
|
|
121
107
|
babelrc: false,
|
|
122
108
|
configFile: false,
|
|
123
|
-
sourceMaps:
|
|
109
|
+
sourceMaps: !!asset.env.sourceMap,
|
|
110
|
+
compact: false,
|
|
124
111
|
parserOpts: {
|
|
125
|
-
plugins: (
|
|
112
|
+
plugins: (_a = config.parserBabelPlugins) !== null && _a !== void 0 ? _a : undefined,
|
|
126
113
|
},
|
|
127
114
|
plugins: [
|
|
128
|
-
...((
|
|
115
|
+
...((_b = config.transformerBabelPlugins) !== null && _b !== void 0 ? _b : []),
|
|
129
116
|
asset.isSource && [
|
|
130
117
|
'@compiled/babel-plugin',
|
|
131
|
-
Object.assign(Object.assign({}, config), { classNameCompressionMap: config.extract && config.classNameCompressionMap, onIncludedFiles: (files) => includedFiles.push(...files), resolver: config.resolver ? config.resolver : (0,
|
|
118
|
+
Object.assign(Object.assign({}, config), { classNameCompressionMap: config.extract && config.classNameCompressionMap, onIncludedFiles: (files) => includedFiles.push(...files), resolver: config.resolver ? config.resolver : (0, utils_3.createDefaultResolver)(config), cache: false }),
|
|
132
119
|
],
|
|
133
120
|
extract && [
|
|
134
121
|
'@compiled/babel-plugin-strip-runtime',
|
|
@@ -142,33 +129,57 @@ exports.default = new plugin_1.Transformer({
|
|
|
142
129
|
name: 'compiled',
|
|
143
130
|
},
|
|
144
131
|
});
|
|
145
|
-
const output = (result === null || result === void 0 ? void 0 : result.code) || '';
|
|
146
132
|
includedFiles.forEach((file) => {
|
|
147
133
|
// Included files are those which have been statically evaluated into this asset.
|
|
148
134
|
// This tells parcel that if any of those files change this asset should be transformed
|
|
149
135
|
// again.
|
|
150
136
|
asset.invalidateOnFileChange(file);
|
|
151
137
|
});
|
|
152
|
-
asset.setCode(output);
|
|
153
138
|
if (extract) {
|
|
154
139
|
// Store styleRules to asset.meta to be used by @compiled/parcel-optimizer
|
|
155
140
|
const metadata = result === null || result === void 0 ? void 0 : result.metadata;
|
|
156
|
-
asset.meta.styleRules = [
|
|
141
|
+
asset.meta.styleRules = [
|
|
142
|
+
...((_d = (_c = asset.meta) === null || _c === void 0 ? void 0 : _c.styleRules) !== null && _d !== void 0 ? _d : []),
|
|
143
|
+
...((_e = metadata.styleRules) !== null && _e !== void 0 ? _e : []),
|
|
144
|
+
];
|
|
145
|
+
}
|
|
146
|
+
if (result === null || result === void 0 ? void 0 : result.ast) {
|
|
147
|
+
asset.setAST({
|
|
148
|
+
type: 'babel',
|
|
149
|
+
version: '7.0.0',
|
|
150
|
+
program: result === null || result === void 0 ? void 0 : result.ast,
|
|
151
|
+
});
|
|
157
152
|
}
|
|
158
153
|
return [asset];
|
|
159
154
|
},
|
|
160
|
-
async generate({ asset, ast }) {
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
//
|
|
164
|
-
const { code,
|
|
165
|
-
|
|
166
|
-
sourceMaps:
|
|
167
|
-
|
|
155
|
+
async generate({ asset, ast, options }) {
|
|
156
|
+
const originalSourceMap = await asset.getMap();
|
|
157
|
+
const sourceFileName = (0, utils_2.relativeUrl)(options.projectRoot, asset.filePath);
|
|
158
|
+
// @ts-expect-error RawMappings should exist here
|
|
159
|
+
const { code, rawMappings } = (0, generator_1.default)(ast.program, {
|
|
160
|
+
sourceFileName,
|
|
161
|
+
sourceMaps: !!asset.env.sourceMap,
|
|
162
|
+
comments: true,
|
|
168
163
|
});
|
|
164
|
+
const map = new source_map_1.default(options.projectRoot);
|
|
165
|
+
if (rawMappings) {
|
|
166
|
+
map.addIndexedMappings(rawMappings);
|
|
167
|
+
}
|
|
168
|
+
if (originalSourceMap) {
|
|
169
|
+
// The babel AST already contains the correct mappings, but not the source contents.
|
|
170
|
+
// We need to copy over the source contents from the original map.
|
|
171
|
+
// @ts-expect-error getSourcesContentMap exists
|
|
172
|
+
const sourcesContent = originalSourceMap.getSourcesContentMap();
|
|
173
|
+
for (const filePath in sourcesContent) {
|
|
174
|
+
const content = sourcesContent[filePath];
|
|
175
|
+
if (content != null) {
|
|
176
|
+
map.setSourceContent(filePath, content);
|
|
177
|
+
}
|
|
178
|
+
}
|
|
179
|
+
}
|
|
169
180
|
return {
|
|
170
181
|
content: code,
|
|
171
|
-
map
|
|
182
|
+
map,
|
|
172
183
|
};
|
|
173
184
|
},
|
|
174
185
|
});
|
package/dist/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":";;;;;AAAA,+
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@compiled/parcel-transformer",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.15.0",
|
|
4
4
|
"description": "A familiar and performant compile time CSS-in-JS library for React.",
|
|
5
5
|
"homepage": "https://compiledcssinjs.com/docs/pkg-parcel-transformer",
|
|
6
6
|
"bugs": "https://github.com/atlassian-labs/compiled/issues/new?assignees=&labels=bug&template=bug_report.md",
|
|
@@ -22,11 +22,12 @@
|
|
|
22
22
|
"dependencies": {
|
|
23
23
|
"@babel/core": "^7.21.8",
|
|
24
24
|
"@babel/generator": "^7.21.5",
|
|
25
|
-
"@compiled/babel-plugin": "^0.28.
|
|
25
|
+
"@compiled/babel-plugin": "^0.28.3",
|
|
26
26
|
"@compiled/babel-plugin-strip-runtime": "^0.28.0",
|
|
27
27
|
"@compiled/utils": "^0.9.2",
|
|
28
28
|
"@parcel/plugin": "^2.8.3",
|
|
29
29
|
"@parcel/source-map": "^2.1.1",
|
|
30
|
+
"@parcel/utils": "^2.8.3",
|
|
30
31
|
"enhanced-resolve": "^5.15.0"
|
|
31
32
|
},
|
|
32
33
|
"devDependencies": {
|
|
@@ -34,7 +35,8 @@
|
|
|
34
35
|
"@parcel/fs": "^2.8.3",
|
|
35
36
|
"@parcel/types": "^2.8.3",
|
|
36
37
|
"@types/babel__core": "^7.20.3",
|
|
37
|
-
"prettier": "^2.8.8"
|
|
38
|
+
"prettier": "^2.8.8",
|
|
39
|
+
"source-map": "^0.7.4"
|
|
38
40
|
},
|
|
39
41
|
"engines": {
|
|
40
42
|
"parcel": "^2.0.0"
|
|
@@ -1,8 +1,11 @@
|
|
|
1
1
|
import { join } from 'path';
|
|
2
2
|
|
|
3
3
|
import Parcel, { createWorkerFarm } from '@parcel/core';
|
|
4
|
-
import { MemoryFS } from '@parcel/fs';
|
|
4
|
+
import { MemoryFS, NodeFS } from '@parcel/fs';
|
|
5
|
+
// eslint-disable-next-line import/namespace
|
|
6
|
+
import type { Asset } from '@parcel/types';
|
|
5
7
|
import { format } from 'prettier';
|
|
8
|
+
import { SourceMapConsumer } from 'source-map';
|
|
6
9
|
|
|
7
10
|
const rootPath = join(__dirname, '..', '..', '..', '..');
|
|
8
11
|
const fixtureRoot = join(rootPath, 'fixtures/parcel-transformer-test-app');
|
|
@@ -15,8 +18,27 @@ afterAll(() => {
|
|
|
15
18
|
});
|
|
16
19
|
|
|
17
20
|
const outputFS = new MemoryFS(workerFarm);
|
|
21
|
+
const nodeFS = new NodeFS();
|
|
18
22
|
|
|
19
|
-
|
|
23
|
+
function findTargetSourcePosition(source: string, regex: RegExp): { line: number; column: number } {
|
|
24
|
+
const lines = source.split('\n');
|
|
25
|
+
|
|
26
|
+
for (let i = 0; i < lines.length; i++) {
|
|
27
|
+
const line = lines[i];
|
|
28
|
+
const match = line.match(regex);
|
|
29
|
+
|
|
30
|
+
if (match && match.index !== undefined) {
|
|
31
|
+
return {
|
|
32
|
+
line: i + 1,
|
|
33
|
+
column: match.index,
|
|
34
|
+
};
|
|
35
|
+
}
|
|
36
|
+
}
|
|
37
|
+
|
|
38
|
+
throw new Error(`Could not find target source\n${source}`);
|
|
39
|
+
}
|
|
40
|
+
|
|
41
|
+
const getParcelInstance = (workingDir: string, sourceMap = false) => {
|
|
20
42
|
return new Parcel({
|
|
21
43
|
config: join(workingDir, '.parcelrc'),
|
|
22
44
|
entries: [join(workingDir, 'src', 'index.html')],
|
|
@@ -24,6 +46,7 @@ const getParcelInstance = (workingDir: string) => {
|
|
|
24
46
|
targets: {
|
|
25
47
|
default: {
|
|
26
48
|
distDir: join(workingDir, 'dist'),
|
|
49
|
+
sourceMap: sourceMap,
|
|
27
50
|
},
|
|
28
51
|
},
|
|
29
52
|
workerFarm,
|
|
@@ -40,12 +63,13 @@ it('transforms assets with babel plugin', async () => {
|
|
|
40
63
|
);
|
|
41
64
|
|
|
42
65
|
const code = await asset?.getCode();
|
|
43
|
-
const appCode = code?.slice(
|
|
44
|
-
code.indexOf('/* index.jsx generated by @compiled/babel-plugin v0.0.0 */')
|
|
45
|
-
);
|
|
66
|
+
const appCode = code?.slice(code.indexOf('var _3'));
|
|
46
67
|
expect(appCode).toMatchInlineSnapshot(`
|
|
47
|
-
"
|
|
68
|
+
"var _3 = "._bfhkbf54{background-color:green}";
|
|
69
|
+
var _2 = "._syaz5scu{color:red}";
|
|
48
70
|
var _ = "._1wyb12am{font-size:50px}";
|
|
71
|
+
console.log("File START");
|
|
72
|
+
var styles = null;
|
|
49
73
|
var App = function() {
|
|
50
74
|
return /*#__PURE__*/ (0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
|
|
51
75
|
children: /*#__PURE__*/ (0, _jsxRuntime.jsxs)(_runtime.CC, {
|
|
@@ -53,12 +77,14 @@ it('transforms assets with babel plugin', async () => {
|
|
|
53
77
|
/*#__PURE__*/ (0, _jsxRuntime.jsx)(_runtime.CS, {
|
|
54
78
|
children: [
|
|
55
79
|
_,
|
|
56
|
-
_2
|
|
80
|
+
_2,
|
|
81
|
+
_3
|
|
57
82
|
]
|
|
58
83
|
}),
|
|
59
84
|
/*#__PURE__*/ (0, _jsxRuntime.jsx)("div", {
|
|
60
85
|
className: (0, _runtime.ax)([
|
|
61
|
-
"_1wyb12am _syaz5scu"
|
|
86
|
+
"_1wyb12am _syaz5scu",
|
|
87
|
+
"_bfhkbf54"
|
|
62
88
|
]),
|
|
63
89
|
children: "hello from parcel"
|
|
64
90
|
})
|
|
@@ -66,10 +92,48 @@ it('transforms assets with babel plugin', async () => {
|
|
|
66
92
|
})
|
|
67
93
|
});
|
|
68
94
|
};
|
|
95
|
+
console.log("File END");
|
|
69
96
|
"
|
|
70
97
|
`);
|
|
71
98
|
}, 50000);
|
|
72
99
|
|
|
100
|
+
it('transforms assets with babel plugin and source map is correct', async () => {
|
|
101
|
+
const parcel = getParcelInstance(fixtureRoot, true);
|
|
102
|
+
const { changedAssets, bundleGraph } = await parcel.run();
|
|
103
|
+
|
|
104
|
+
const asset = Array.from(changedAssets.values()).find(
|
|
105
|
+
(asset) => asset.filePath === join(fixtureRoot, 'src/index.jsx')
|
|
106
|
+
);
|
|
107
|
+
expect(asset).toBeDefined();
|
|
108
|
+
const bundle = bundleGraph.getBundlesWithAsset(asset as Asset)[0];
|
|
109
|
+
|
|
110
|
+
const mapFile = await outputFS.readFile(`${bundle.filePath}.map`, 'utf8');
|
|
111
|
+
|
|
112
|
+
const rawSourceMap = JSON.parse(mapFile);
|
|
113
|
+
const consumer = await new SourceMapConsumer(rawSourceMap);
|
|
114
|
+
|
|
115
|
+
const expectedOriginalPosition = findTargetSourcePosition(
|
|
116
|
+
await nodeFS.readFile((asset as Asset).filePath, 'utf8'),
|
|
117
|
+
/File END/
|
|
118
|
+
);
|
|
119
|
+
const expectedGeneratedPosition = findTargetSourcePosition(
|
|
120
|
+
await outputFS.readFile(bundle.filePath, 'utf8'),
|
|
121
|
+
/File END/
|
|
122
|
+
);
|
|
123
|
+
|
|
124
|
+
const actualGeneratedPosition = consumer.generatedPositionFor({
|
|
125
|
+
...expectedOriginalPosition,
|
|
126
|
+
source: 'fixtures/parcel-transformer-test-app/src/index.jsx',
|
|
127
|
+
});
|
|
128
|
+
const actualOriginalPosition = consumer.originalPositionFor(expectedGeneratedPosition);
|
|
129
|
+
|
|
130
|
+
expect('fixtures/parcel-transformer-test-app/src/index.jsx').toEqual(
|
|
131
|
+
actualOriginalPosition?.source
|
|
132
|
+
);
|
|
133
|
+
expect(actualGeneratedPosition.line).toBe(expectedGeneratedPosition.line);
|
|
134
|
+
expect(actualGeneratedPosition.column).toBe(expectedGeneratedPosition.column - 1);
|
|
135
|
+
}, 50000);
|
|
136
|
+
|
|
73
137
|
it('transforms assets with custom resolve and statically evaluates imports', async () => {
|
|
74
138
|
const customResolveFixtureRoot = join(
|
|
75
139
|
rootPath,
|
package/src/index.ts
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { join
|
|
1
|
+
import { join } from 'path';
|
|
2
2
|
|
|
3
3
|
import { parseAsync, transformFromAstAsync } from '@babel/core';
|
|
4
4
|
import generate from '@babel/generator';
|
|
@@ -10,6 +10,8 @@ import type {
|
|
|
10
10
|
import { toBoolean } from '@compiled/utils';
|
|
11
11
|
import { Transformer } from '@parcel/plugin';
|
|
12
12
|
import SourceMap from '@parcel/source-map';
|
|
13
|
+
// @ts-expect-error missing type
|
|
14
|
+
import { relativeUrl } from '@parcel/utils';
|
|
13
15
|
|
|
14
16
|
import type { ParcelTransformerOpts } from './types';
|
|
15
17
|
import { createDefaultResolver } from './utils';
|
|
@@ -87,7 +89,10 @@ export default new Transformer<ParcelTransformerOpts>({
|
|
|
87
89
|
}
|
|
88
90
|
|
|
89
91
|
const code = await asset.getCode();
|
|
90
|
-
if (
|
|
92
|
+
if (
|
|
93
|
+
code.indexOf('@compiled/react') === -1 &&
|
|
94
|
+
(config.importSources?.every((importSource) => !code.includes(importSource)) ?? true)
|
|
95
|
+
) {
|
|
91
96
|
// We only want to parse files that are actually using Compiled.
|
|
92
97
|
// For everything else we bail out.
|
|
93
98
|
return undefined;
|
|
@@ -111,27 +116,6 @@ export default new Transformer<ParcelTransformerOpts>({
|
|
|
111
116
|
},
|
|
112
117
|
|
|
113
118
|
async transform({ asset, config, options }) {
|
|
114
|
-
const distStyleRules: string[] = [];
|
|
115
|
-
let someCode = await asset.getCode();
|
|
116
|
-
for (const match of someCode.matchAll(
|
|
117
|
-
/(import ['"](?<importSpec>.+\.compiled\.css)['"];)|(require\(['"](?<requireSpec>.+\.compiled\.css)['"]\);)/g
|
|
118
|
-
)) {
|
|
119
|
-
const specifierPath = match.groups?.importSpec || match.groups?.requireSpec;
|
|
120
|
-
if (!specifierPath) continue;
|
|
121
|
-
someCode = someCode.replace(match[0], '');
|
|
122
|
-
asset.setCode(someCode);
|
|
123
|
-
|
|
124
|
-
const cssFilePath = isAbsolute(specifierPath)
|
|
125
|
-
? specifierPath
|
|
126
|
-
: join(dirname(asset.filePath), specifierPath);
|
|
127
|
-
|
|
128
|
-
const cssContent = (await asset.fs.readFile(cssFilePath)).toString().split('\n');
|
|
129
|
-
if (!asset.meta.styleRules) {
|
|
130
|
-
asset.meta.styleRules = [];
|
|
131
|
-
}
|
|
132
|
-
(asset.meta.styleRules as string[]).push(...cssContent);
|
|
133
|
-
}
|
|
134
|
-
|
|
135
119
|
const ast = await asset.getAST();
|
|
136
120
|
|
|
137
121
|
if (!ast) {
|
|
@@ -146,12 +130,13 @@ export default new Transformer<ParcelTransformerOpts>({
|
|
|
146
130
|
const code = asset.isASTDirty() ? undefined : await asset.getCode();
|
|
147
131
|
|
|
148
132
|
const result = await transformFromAstAsync(ast.program, code, {
|
|
149
|
-
code:
|
|
150
|
-
ast:
|
|
133
|
+
code: false,
|
|
134
|
+
ast: true,
|
|
151
135
|
filename: asset.filePath,
|
|
152
136
|
babelrc: false,
|
|
153
137
|
configFile: false,
|
|
154
|
-
sourceMaps:
|
|
138
|
+
sourceMaps: !!asset.env.sourceMap,
|
|
139
|
+
compact: false,
|
|
155
140
|
parserOpts: {
|
|
156
141
|
plugins: config.parserBabelPlugins ?? undefined,
|
|
157
142
|
},
|
|
@@ -180,8 +165,6 @@ export default new Transformer<ParcelTransformerOpts>({
|
|
|
180
165
|
},
|
|
181
166
|
});
|
|
182
167
|
|
|
183
|
-
const output = result?.code || '';
|
|
184
|
-
|
|
185
168
|
includedFiles.forEach((file) => {
|
|
186
169
|
// Included files are those which have been statically evaluated into this asset.
|
|
187
170
|
// This tells parcel that if any of those files change this asset should be transformed
|
|
@@ -189,30 +172,58 @@ export default new Transformer<ParcelTransformerOpts>({
|
|
|
189
172
|
asset.invalidateOnFileChange(file);
|
|
190
173
|
});
|
|
191
174
|
|
|
192
|
-
asset.setCode(output);
|
|
193
|
-
|
|
194
175
|
if (extract) {
|
|
195
176
|
// Store styleRules to asset.meta to be used by @compiled/parcel-optimizer
|
|
196
177
|
const metadata = result?.metadata as BabelFileMetadata;
|
|
197
|
-
asset.meta.styleRules = [
|
|
178
|
+
asset.meta.styleRules = [
|
|
179
|
+
...((asset.meta?.styleRules as string[] | undefined) ?? []),
|
|
180
|
+
...(metadata.styleRules ?? []),
|
|
181
|
+
];
|
|
182
|
+
}
|
|
183
|
+
|
|
184
|
+
if (result?.ast) {
|
|
185
|
+
asset.setAST({
|
|
186
|
+
type: 'babel',
|
|
187
|
+
version: '7.0.0',
|
|
188
|
+
program: result?.ast,
|
|
189
|
+
});
|
|
198
190
|
}
|
|
199
191
|
|
|
200
192
|
return [asset];
|
|
201
193
|
},
|
|
202
194
|
|
|
203
|
-
async generate({ asset, ast }) {
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
|
|
210
|
-
|
|
195
|
+
async generate({ asset, ast, options }) {
|
|
196
|
+
const originalSourceMap = await asset.getMap();
|
|
197
|
+
const sourceFileName: string = relativeUrl(options.projectRoot, asset.filePath);
|
|
198
|
+
|
|
199
|
+
// @ts-expect-error RawMappings should exist here
|
|
200
|
+
const { code, rawMappings } = generate(ast.program, {
|
|
201
|
+
sourceFileName,
|
|
202
|
+
sourceMaps: !!asset.env.sourceMap,
|
|
203
|
+
comments: true,
|
|
211
204
|
});
|
|
212
205
|
|
|
206
|
+
const map = new SourceMap(options.projectRoot);
|
|
207
|
+
if (rawMappings) {
|
|
208
|
+
map.addIndexedMappings(rawMappings);
|
|
209
|
+
}
|
|
210
|
+
|
|
211
|
+
if (originalSourceMap) {
|
|
212
|
+
// The babel AST already contains the correct mappings, but not the source contents.
|
|
213
|
+
// We need to copy over the source contents from the original map.
|
|
214
|
+
// @ts-expect-error getSourcesContentMap exists
|
|
215
|
+
const sourcesContent = originalSourceMap.getSourcesContentMap();
|
|
216
|
+
for (const filePath in sourcesContent) {
|
|
217
|
+
const content = sourcesContent[filePath];
|
|
218
|
+
if (content != null) {
|
|
219
|
+
map.setSourceContent(filePath, content);
|
|
220
|
+
}
|
|
221
|
+
}
|
|
222
|
+
}
|
|
223
|
+
|
|
213
224
|
return {
|
|
214
225
|
content: code,
|
|
215
|
-
map
|
|
226
|
+
map,
|
|
216
227
|
};
|
|
217
228
|
},
|
|
218
229
|
});
|