-
Notifications
You must be signed in to change notification settings - Fork 0
/
babelrc-9-4-0.ts
129 lines (112 loc) · 3.61 KB
/
babelrc-9-4-0.ts
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
import {
chain,
Rule,
SchematicContext,
Tree,
} from '@angular-devkit/schematics';
import {
stripIndent,
stripIndents,
} from '@angular-devkit/core/src/utils/literals';
import { initRootBabelConfig } from '../utils/rules';
import { addDepsToPackageJson, formatFiles } from '@nrwl/workspace';
import {
createProjectGraphAsync,
isNpmProject,
} from '@nrwl/workspace/src/core/project-graph';
let addedEmotionPreset = false;
/*
* This migration will do a few things:
*
* - Create the base babel.config.json file if it doesn't already exist
* - Create .babelrc files for each React project that doesn't already have one
* - For any projects that are not migrated, display a message so users are not surprised.
*/
export default function update(): Rule {
return async (host: Tree, context: SchematicContext) => {
const updates = [];
const conflicts: Array<[string, string]> = [];
const projectGraph = await createProjectGraphAsync();
if (host.exists('/babel.config.json')) {
context.logger.info(
`
Found an existing babel.config.json file so we skipped creating it.
You may want to update it to include the Nx preset "@nrwl/web/babel".
`
);
} else if (host.exists('/babel.config.js')) {
context.logger.info(
`
Found an existing babel.config.js file so we skipped creating it.
You may want to update it to include the Nx preset "@nrwl/web/babel".
`
);
} else {
updates.push(initRootBabelConfig());
}
Object.keys(projectGraph.nodes).forEach((name) => {
const p = projectGraph.nodes[name];
const deps = projectGraph.dependencies[name];
const isReact = deps.some(
(d) =>
isNpmProject(projectGraph.nodes[d.target]) &&
d.target.indexOf('react') !== -1
);
if (isReact) {
updates.push((host) => {
const babelrcPath = `${p.data.root}/.babelrc`;
if (host.exists(babelrcPath)) {
conflicts.push([name, babelrcPath]);
} else {
createBabelrc(host, context, babelrcPath, deps);
}
});
}
});
if (conflicts.length > 0) {
context.logger.info(stripIndent`
The following projects already have .babelrc so we did not create them:
${conflicts
.map(([name, babelrc]) => `${name} - ${babelrc}`)
.join('\n ')}
You may want to update them to include the Nx preset "@nrwl/react/babel".
`);
}
updates.push((host) =>
addedEmotionPreset ? addEmotionPresetPackage : host
);
updates.push(formatFiles());
return chain(updates);
};
}
function createBabelrc(host, context, babelrcPath, deps) {
const babelrc = {
presets: ['@nrwl/react/babel'],
plugins: [],
};
let added = 0;
if (deps.some((d) => d.target === 'npm:styled-components')) {
babelrc.plugins.push(['styled-components', { pure: true, ssr: true }]);
added++;
}
if (deps.some((d) => d.target.startsWith('npm:@emotion'))) {
babelrc.presets.push('@emotion/babel-preset-css-prop');
addedEmotionPreset = true;
added++;
}
if (added > 1) {
context.logger.warn(
stripIndents`We created a babel config at ${babelrcPath} with both styled-components and emotion plugins.
Only one should be used, please remove the unused plugin.
For example, if you don't use styled-components, then remove that plugin from the .babelrc file.
`
);
}
host.create(babelrcPath, JSON.stringify(babelrc, null, 2));
}
const addEmotionPresetPackage = addDepsToPackageJson(
{},
{
'@emotion/babel-preset-css-prop': '10.0.27',
}
);