babel-preset-startupjs 0.60.0-canary.0 → 0.60.0-canary.11
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/index.js +239 -2
- package/package.json +13 -6
- package/utils.js +35 -0
package/index.js
CHANGED
|
@@ -1,4 +1,74 @@
|
|
|
1
|
-
|
|
1
|
+
/**
|
|
2
|
+
* Compilation pipeline:
|
|
3
|
+
* 1. Transform pug to jsx
|
|
4
|
+
* 2. Auto-load startupjs plugins
|
|
5
|
+
* 3. Run eliminator to remove code targeting other envs
|
|
6
|
+
* 4. Transform CSS modules
|
|
7
|
+
*
|
|
8
|
+
* Options:
|
|
9
|
+
* platform - Force platform to compile to (e.g. 'ios', 'android', 'web').
|
|
10
|
+
* Default: 'web' (or auto-detected on React Native)
|
|
11
|
+
* On React Native (Metro) this gets automatically detected inside babel plugins.
|
|
12
|
+
* reactType - Force the React type - RN or pure web React (e.g. 'react-native', 'web').
|
|
13
|
+
* Default: undefined (auto-detected)
|
|
14
|
+
* This shouldn't be needed in most cases since it will be automatically detected.
|
|
15
|
+
* cache - Force the CSS caching library instance (e.g. 'teamplay').
|
|
16
|
+
* Default: undefined (auto-detected)
|
|
17
|
+
* This shouldn't be needed in most cases since it will be automatically detected.
|
|
18
|
+
* transformPug - Whether to transform pug to jsx.
|
|
19
|
+
* Default: true
|
|
20
|
+
* transformCss - Whether to transform CSS modules (styl/css files and styl`` css`` in JSX).
|
|
21
|
+
* Default: true
|
|
22
|
+
* useRequireContext - Whether to use require.context for loading startupjs plugins.
|
|
23
|
+
* The underlying environment must support require.context (e.g. Metro, Webpack).
|
|
24
|
+
* Default: true
|
|
25
|
+
* clientOnly - Whether to transform model/*.js files to keep only the client-relevant code.
|
|
26
|
+
* Default: true
|
|
27
|
+
* This option is required when building for the client (React Native or web) so that
|
|
28
|
+
* server-only code is removed from model files and secret information is not leaked to the client.
|
|
29
|
+
* envs - Array of envs to keep during code elimination of the startupjs config and plugins.
|
|
30
|
+
* Default: ['features', 'isomorphic', 'client']
|
|
31
|
+
* On the server, this should usually include 'server' instead of 'client':
|
|
32
|
+
* ['features', 'isomorphic', 'server']
|
|
33
|
+
* isStartupjsFile - A function (filename, code) => boolean that checks whether the given file
|
|
34
|
+
* is part of the startupjs ecosystem (a plugin, startupjs.config.js, loadStartupjsConfig.js or a model file).
|
|
35
|
+
* Default: a function that returns true for all startupjs plugin ecosystem files. And also
|
|
36
|
+
* when clientOnly is true, it also returns true for model/*.js files to keep only client-relevant code there.
|
|
37
|
+
* docgen - Whether to enable docgen features - magic exports of JSON schemas from TypeScript interfaces.
|
|
38
|
+
* Default: false
|
|
39
|
+
*/
|
|
40
|
+
const { createStartupjsFileChecker, CONFIG_FILENAME_REGEX } = require('./utils.js')
|
|
41
|
+
const PLUGIN_KEYS = ['name', 'for', 'order', 'enabled']
|
|
42
|
+
const PROJECT_KEYS = ['plugins', 'modules']
|
|
43
|
+
const ALL_ENVS = ['features', 'isomorphic', 'client', 'server', 'build']
|
|
44
|
+
const MAGIC_IMPORTS = ['startupjs/registry', '@startupjs/registry']
|
|
45
|
+
|
|
46
|
+
module.exports = (api, {
|
|
47
|
+
platform,
|
|
48
|
+
reactType,
|
|
49
|
+
cache,
|
|
50
|
+
compileCssImports,
|
|
51
|
+
cssFileExtensions,
|
|
52
|
+
transformCss = true,
|
|
53
|
+
transformPug = true,
|
|
54
|
+
useRequireContext = true,
|
|
55
|
+
clientOnly = true,
|
|
56
|
+
envs = ['features', 'isomorphic', 'client'],
|
|
57
|
+
isStartupjsFile = createStartupjsFileChecker({ clientOnly }),
|
|
58
|
+
docgen = false
|
|
59
|
+
} = {}) => {
|
|
60
|
+
const isMetro = api.caller(caller => caller?.name === 'metro')
|
|
61
|
+
|
|
62
|
+
// By default on Metro we don't need to compile CSS imports since we are relying on the custom
|
|
63
|
+
// StartupJS metro-babel-transformer which handles CSS imports as separate files.
|
|
64
|
+
if (compileCssImports == null && isMetro) compileCssImports = false
|
|
65
|
+
|
|
66
|
+
// on Metro we transform any CSS imports since StartupJS metro-babel-transformer
|
|
67
|
+
// turns off Expo's default CSS support and handles only our CSS imports.
|
|
68
|
+
// When used in a plain Web project though though,
|
|
69
|
+
// we want to only handle the default ['cssx.css', 'cssx.styl'] extensions.
|
|
70
|
+
if (cssFileExtensions == null && isMetro) cssFileExtensions = ['styl', 'css']
|
|
71
|
+
|
|
2
72
|
return {
|
|
3
73
|
overrides: [{
|
|
4
74
|
test: isJsxSource,
|
|
@@ -22,8 +92,175 @@ module.exports = (api, { platform, env } = {}) => {
|
|
|
22
92
|
]
|
|
23
93
|
}, {
|
|
24
94
|
plugins: [
|
|
95
|
+
docgen && [require('@startupjs/babel-plugin-ts-to-json-schema'), {
|
|
96
|
+
magicExportName: '_PropsJsonSchema',
|
|
97
|
+
interfaceMatch: 'export interface'
|
|
98
|
+
}],
|
|
99
|
+
|
|
100
|
+
// transform pug to jsx. This generates a bunch of new AST nodes
|
|
101
|
+
// (it's important to do this first before any dead code elimination runs)
|
|
102
|
+
transformPug && [require('cssxjs/babel/plugin-react-pug'), { classAttribute: 'styleName' }],
|
|
103
|
+
|
|
104
|
+
// inline CSS modules (styl`` in the same JSX file -- similar to how it is in Vue.js)
|
|
105
|
+
transformCss && [require('cssxjs/babel/plugin-rn-stylename-inline'), {
|
|
106
|
+
platform
|
|
107
|
+
}],
|
|
108
|
+
// CSS modules (separate .styl/.css file)
|
|
109
|
+
transformCss && [require('cssxjs/babel/plugin-rn-stylename-to-style'), {
|
|
110
|
+
extensions: cssFileExtensions,
|
|
111
|
+
useImport: true,
|
|
112
|
+
reactType,
|
|
113
|
+
cache,
|
|
114
|
+
compileCssImports
|
|
115
|
+
}],
|
|
116
|
+
|
|
117
|
+
// auto-load startupjs plugins
|
|
118
|
+
// traverse "exports" of package.json and all dependencies to find all startupjs plugins
|
|
119
|
+
// and automatically import them in the main startupjs.config.js file
|
|
120
|
+
[require('@startupjs/babel-plugin-startupjs-plugins'), { useRequireContext }],
|
|
121
|
+
|
|
122
|
+
// run eliminator to remove code targeting other envs.
|
|
123
|
+
// For example, only keep code related to 'client' and 'isomorphic' envs
|
|
124
|
+
// (in which case any code related to 'server' and 'build' envs will be removed)
|
|
125
|
+
[require('@startupjs/babel-plugin-eliminator'), {
|
|
126
|
+
shouldTransformFileChecker: isStartupjsFile,
|
|
127
|
+
trimObjects: [{
|
|
128
|
+
magicFilenameRegex: CONFIG_FILENAME_REGEX,
|
|
129
|
+
magicExport: 'default',
|
|
130
|
+
targetObjectJsonPath: '$.modules.*',
|
|
131
|
+
ensureOnlyKeys: ALL_ENVS,
|
|
132
|
+
keepKeys: envs
|
|
133
|
+
}, {
|
|
134
|
+
magicFilenameRegex: CONFIG_FILENAME_REGEX,
|
|
135
|
+
magicExport: 'default',
|
|
136
|
+
targetObjectJsonPath: '$.plugins.*',
|
|
137
|
+
ensureOnlyKeys: ALL_ENVS,
|
|
138
|
+
keepKeys: envs
|
|
139
|
+
}, {
|
|
140
|
+
magicFilenameRegex: CONFIG_FILENAME_REGEX,
|
|
141
|
+
magicExport: 'default',
|
|
142
|
+
targetObjectJsonPath: '$',
|
|
143
|
+
// envs on the top level are the alias for '$.modules.startupjs'
|
|
144
|
+
ensureOnlyKeys: [...PROJECT_KEYS, ...ALL_ENVS],
|
|
145
|
+
keepKeys: [...PROJECT_KEYS, ...envs]
|
|
146
|
+
}, {
|
|
147
|
+
functionName: 'createPlugin',
|
|
148
|
+
magicImports: MAGIC_IMPORTS,
|
|
149
|
+
ensureOnlyKeys: [...PLUGIN_KEYS, ...ALL_ENVS],
|
|
150
|
+
keepKeys: [...PLUGIN_KEYS, ...envs]
|
|
151
|
+
}],
|
|
152
|
+
...(clientOnly
|
|
153
|
+
? {
|
|
154
|
+
transformFunctionCalls: [{
|
|
155
|
+
// direct named exports of aggregation() within model/*.js files
|
|
156
|
+
// are replaced with aggregationHeader() calls.
|
|
157
|
+
// 'collection' is the filename without extension
|
|
158
|
+
// 'name' is the direct named export const name
|
|
159
|
+
//
|
|
160
|
+
// Example:
|
|
161
|
+
//
|
|
162
|
+
// // in model/games.js
|
|
163
|
+
// export const $$byGameId = aggregation(({ gameId }) => ({ gameId }))
|
|
164
|
+
//
|
|
165
|
+
// will be replaced with:
|
|
166
|
+
//
|
|
167
|
+
// __aggregationHeader({ collection: 'games', name: '$$byGameId' })
|
|
168
|
+
//
|
|
169
|
+
functionName: 'aggregation',
|
|
170
|
+
magicImports: ['startupjs'],
|
|
171
|
+
requirements: {
|
|
172
|
+
argumentsAmount: 1,
|
|
173
|
+
directNamedExportedAsConst: true
|
|
174
|
+
},
|
|
175
|
+
replaceWith: {
|
|
176
|
+
newFunctionNameFromSameImport: '__aggregationHeader',
|
|
177
|
+
newCallArgumentsTemplate: `[
|
|
178
|
+
{
|
|
179
|
+
collection: %%filenameWithoutExtension%%,
|
|
180
|
+
name: %%directNamedExportConstName%%
|
|
181
|
+
}
|
|
182
|
+
]`
|
|
183
|
+
}
|
|
184
|
+
}, {
|
|
185
|
+
// export default inside of aggregation() within a separate model/*.$$myAggregation.js files
|
|
186
|
+
// are replaced with aggregationHeader() calls.
|
|
187
|
+
// Filepath is stripped of the extensions and split into sections (by dots and slashes)
|
|
188
|
+
// 'name' is the last section.
|
|
189
|
+
// 'collection' is the section before it.
|
|
190
|
+
//
|
|
191
|
+
// Example:
|
|
192
|
+
//
|
|
193
|
+
// // in model/games/$$active.js
|
|
194
|
+
// export default aggregation(({ gameId }) => ({ gameId }))
|
|
195
|
+
//
|
|
196
|
+
// will be replaced with:
|
|
197
|
+
//
|
|
198
|
+
// __aggregationHeader({ collection: 'games', name: '$$active' })
|
|
199
|
+
//
|
|
200
|
+
functionName: 'aggregation',
|
|
201
|
+
magicImports: ['startupjs'],
|
|
202
|
+
requirements: {
|
|
203
|
+
argumentsAmount: 1,
|
|
204
|
+
directDefaultExported: true
|
|
205
|
+
},
|
|
206
|
+
replaceWith: {
|
|
207
|
+
newFunctionNameFromSameImport: '__aggregationHeader',
|
|
208
|
+
newCallArgumentsTemplate: `[
|
|
209
|
+
{
|
|
210
|
+
collection: %%folderAndFilenameWithoutExtension%%.split(/[\\\\/\\.]/).at(-2),
|
|
211
|
+
name: %%folderAndFilenameWithoutExtension%%.split(/[\\\\/\\.]/).at(-1)
|
|
212
|
+
}
|
|
213
|
+
]`
|
|
214
|
+
}
|
|
215
|
+
}, {
|
|
216
|
+
// TODO: this has to be implemented! It's not actually working yet.
|
|
217
|
+
|
|
218
|
+
// any other calls to aggregation() must explicitly define the collection and name
|
|
219
|
+
// as the second argument. If not, the build will fail.
|
|
220
|
+
//
|
|
221
|
+
// Example:
|
|
222
|
+
//
|
|
223
|
+
// aggregation(
|
|
224
|
+
// ({ gameId }) => ({ gameId }),
|
|
225
|
+
// { collection: 'games', name: 'byGameId' }
|
|
226
|
+
// )
|
|
227
|
+
//
|
|
228
|
+
// will be replaced with:
|
|
229
|
+
//
|
|
230
|
+
// __aggregationHeader({ collection: 'games', name: 'byGameId' })
|
|
231
|
+
//
|
|
232
|
+
functionName: 'aggregation',
|
|
233
|
+
magicImports: ['startupjs'],
|
|
234
|
+
requirements: {
|
|
235
|
+
argumentsAmount: 2
|
|
236
|
+
},
|
|
237
|
+
throwIfRequirementsNotMet: true,
|
|
238
|
+
replaceWith: {
|
|
239
|
+
newFunctionNameFromSameImport: '__aggregationHeader',
|
|
240
|
+
newCallArgumentsTemplate: '[%%argument1%%]' // 0-based index
|
|
241
|
+
}
|
|
242
|
+
}, {
|
|
243
|
+
// remove accessControl() calls (replace with undefined)
|
|
244
|
+
functionName: 'accessControl',
|
|
245
|
+
magicImports: ['startupjs'],
|
|
246
|
+
replaceWith: {
|
|
247
|
+
remove: true // replace the whole function call with undefined
|
|
248
|
+
}
|
|
249
|
+
}, {
|
|
250
|
+
// remove serverOnly() calls (replace with undefined)
|
|
251
|
+
functionName: 'serverOnly',
|
|
252
|
+
magicImports: ['startupjs'],
|
|
253
|
+
replaceWith: {
|
|
254
|
+
remove: true // replace the whole function call with undefined
|
|
255
|
+
}
|
|
256
|
+
}]
|
|
257
|
+
}
|
|
258
|
+
: {}
|
|
259
|
+
)
|
|
260
|
+
}],
|
|
261
|
+
|
|
25
262
|
// debugging features
|
|
26
|
-
|
|
263
|
+
require('@startupjs/babel-plugin-startupjs-debug'),
|
|
27
264
|
require('@startupjs/babel-plugin-i18n-extract')
|
|
28
265
|
].filter(Boolean)
|
|
29
266
|
}]
|
package/package.json
CHANGED
|
@@ -1,10 +1,11 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "babel-preset-startupjs",
|
|
3
|
-
"version": "0.60.0-canary.
|
|
3
|
+
"version": "0.60.0-canary.11",
|
|
4
4
|
"description": "Babel preset for compiling StartupJS app on server, web, native",
|
|
5
5
|
"main": "index.js",
|
|
6
6
|
"exports": {
|
|
7
|
-
".": "./index.js"
|
|
7
|
+
".": "./index.js",
|
|
8
|
+
"./utils": "./utils.js"
|
|
8
9
|
},
|
|
9
10
|
"publishConfig": {
|
|
10
11
|
"access": "public"
|
|
@@ -14,9 +15,15 @@
|
|
|
14
15
|
"@babel/core": "^7.9.0",
|
|
15
16
|
"@babel/plugin-syntax-jsx": "^7.0.0",
|
|
16
17
|
"@babel/plugin-syntax-typescript": "^7.23.3",
|
|
17
|
-
"@startupjs/babel-plugin-
|
|
18
|
-
"@startupjs/babel-plugin-
|
|
19
|
-
"@startupjs/babel-plugin-startupjs
|
|
18
|
+
"@startupjs/babel-plugin-eliminator": "^0.60.0-canary.0",
|
|
19
|
+
"@startupjs/babel-plugin-i18n-extract": "^0.60.0-canary.7",
|
|
20
|
+
"@startupjs/babel-plugin-startupjs": "^0.60.0-canary.7",
|
|
21
|
+
"@startupjs/babel-plugin-startupjs-debug": "^0.60.0-canary.7",
|
|
22
|
+
"@startupjs/babel-plugin-startupjs-plugins": "^0.60.0-canary.0",
|
|
23
|
+
"@startupjs/babel-plugin-ts-to-json-schema": "^0.60.0-canary.11"
|
|
20
24
|
},
|
|
21
|
-
"
|
|
25
|
+
"peerDependencies": {
|
|
26
|
+
"cssxjs": "*"
|
|
27
|
+
},
|
|
28
|
+
"gitHead": "98f7cc4f4c26816b15366986e81de0a4b996f8b1"
|
|
22
29
|
}
|
package/utils.js
ADDED
|
@@ -0,0 +1,35 @@
|
|
|
1
|
+
// NOTE: startupjs.config.cjs is used by the old bundler. This regex does not include it.
|
|
2
|
+
exports.CONFIG_FILENAME_REGEX = /(?:^|[\\/])startupjs\.config\.m?[jt]sx?$/
|
|
3
|
+
exports.PLUGIN_FILENAME_REGEX = /(?:^|[.\\/])plugin\.[mc]?[jt]sx?$/
|
|
4
|
+
exports.LOAD_CONFIG_FILENAME_REGEX = /(?:^|[\\/])loadStartupjsConfig\.m?[jt]sx?$/
|
|
5
|
+
exports.MODEL_FILENAME_REGEX = /(?:^|[.\\/])model[\\/].*\.[mc]?[jt]sx?$/
|
|
6
|
+
const STARTUPJS_FILE_CONTENT_REGEX = /['"]startupjs['"]/
|
|
7
|
+
|
|
8
|
+
exports.isStartupjsPluginEcosystemFile = filename => {
|
|
9
|
+
return (
|
|
10
|
+
exports.PLUGIN_FILENAME_REGEX.test(filename) ||
|
|
11
|
+
exports.CONFIG_FILENAME_REGEX.test(filename) ||
|
|
12
|
+
exports.LOAD_CONFIG_FILENAME_REGEX.test(filename)
|
|
13
|
+
)
|
|
14
|
+
}
|
|
15
|
+
|
|
16
|
+
exports.isModelFile = (filename, code) => {
|
|
17
|
+
return exports.MODEL_FILENAME_REGEX.test(filename) && STARTUPJS_FILE_CONTENT_REGEX.test(code)
|
|
18
|
+
}
|
|
19
|
+
|
|
20
|
+
exports.createStartupjsFileChecker = ({ clientOnly } = {}) => {
|
|
21
|
+
return (filename, code) => {
|
|
22
|
+
if (exports.isStartupjsPluginEcosystemFile(filename)) return true
|
|
23
|
+
if (clientOnly) {
|
|
24
|
+
if (code != null) {
|
|
25
|
+
if (exports.isModelFile(filename, code)) return true
|
|
26
|
+
} else {
|
|
27
|
+
console.warn(
|
|
28
|
+
'[babel-preset-startupjs] File\'s source code must be provided when clientOnly is true. ' +
|
|
29
|
+
'Assuming false for isModelFile check. Filename:', filename
|
|
30
|
+
)
|
|
31
|
+
}
|
|
32
|
+
}
|
|
33
|
+
return false
|
|
34
|
+
}
|
|
35
|
+
}
|