-
Notifications
You must be signed in to change notification settings - Fork 1.2k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
feat: add defineTechStack api (#2042)
* feat: add createTechStack api * refactor: change to defineTechStack, restore built-in ReactTechStack * refactor: remain consistent with the original interface --------- Co-authored-by: Peach <scdzwyxst@gmail.com>
- Loading branch information
1 parent
e227b15
commit 4859310
Showing
5 changed files
with
116 additions
and
116 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,62 +1,48 @@ | ||
import { compile } from '@/compiler/node'; | ||
import type { | ||
IDumiTechStack, | ||
IDumiTechStackOnBlockLoadArgs, | ||
IDumiTechStackOnBlockLoadResult, | ||
IDumiTechStackRuntimeOpts, | ||
} from 'dumi/tech-stack-utils'; | ||
import { wrapDemoWithFn } from 'dumi/tech-stack-utils'; | ||
import type { IDumiTechStackRuntimeOpts } from 'dumi/tech-stack-utils'; | ||
import { defineTechStack, wrapDemoWithFn } from 'dumi/tech-stack-utils'; | ||
import hashId from 'hash-sum'; | ||
import type { Element } from 'hast'; | ||
|
||
export default class VueJSXTechStack implements IDumiTechStack { | ||
name = 'vue3-tsx'; | ||
|
||
runtimeOpts!: IDumiTechStackRuntimeOpts; | ||
|
||
constructor(runtimeOpts: IDumiTechStackRuntimeOpts) { | ||
this.runtimeOpts = runtimeOpts; | ||
} | ||
|
||
isSupported(_: Element, lang: string) { | ||
return ['jsx', 'tsx'].includes(lang); | ||
} | ||
|
||
onBlockLoad( | ||
args: IDumiTechStackOnBlockLoadArgs, | ||
): IDumiTechStackOnBlockLoadResult | null { | ||
if (!args.path.endsWith('.tsx') && !args.path.endsWith('.jsx')) return null; | ||
const { filename } = args; | ||
return { | ||
type: 'tsx', | ||
content: compile({ | ||
id: filename, | ||
filename, | ||
code: args.entryPointCode, | ||
}) as string, | ||
}; | ||
} | ||
|
||
transformCode(...[raw, opts]: Parameters<IDumiTechStack['transformCode']>) { | ||
if (opts.type === 'code-block') { | ||
const filename = opts.fileAbsPath; | ||
|
||
const result = compile({ | ||
id: hashId(raw), | ||
filename, | ||
code: raw, | ||
}) as string; | ||
|
||
if (result) { | ||
const code = wrapDemoWithFn(result, { | ||
export const VueJSXTechStack = (runtimeOpts: IDumiTechStackRuntimeOpts) => | ||
defineTechStack({ | ||
name: 'vue3-tsx', | ||
runtimeOpts, | ||
isSupported(_, lang: string) { | ||
return ['jsx', 'tsx'].includes(lang); | ||
}, | ||
onBlockLoad(args) { | ||
if (!args.path.endsWith('.tsx') && !args.path.endsWith('.jsx')) | ||
return null; | ||
const { filename } = args; | ||
return { | ||
type: 'tsx', | ||
content: compile({ | ||
id: filename, | ||
filename, | ||
code: args.entryPointCode, | ||
}) as string, | ||
}; | ||
}, | ||
transformCode(raw, opts) { | ||
if (opts.type === 'code-block') { | ||
const filename = opts.fileAbsPath; | ||
|
||
const result = compile({ | ||
id: hashId(raw), | ||
filename, | ||
parserConfig: { | ||
syntax: 'ecmascript', | ||
}, | ||
}); | ||
return `(${code})()`; | ||
code: raw, | ||
}) as string; | ||
|
||
if (result) { | ||
const code = wrapDemoWithFn(result, { | ||
filename, | ||
parserConfig: { | ||
syntax: 'ecmascript', | ||
}, | ||
}); | ||
return `(${code})()`; | ||
} | ||
} | ||
} | ||
return raw; | ||
} | ||
} | ||
return raw; | ||
}, | ||
}); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,61 +1,47 @@ | ||
import { compile, compiler } from '@/compiler/node'; | ||
import type { | ||
IDumiTechStack, | ||
IDumiTechStackOnBlockLoadArgs, | ||
IDumiTechStackOnBlockLoadResult, | ||
IDumiTechStackRuntimeOpts, | ||
} from 'dumi/tech-stack-utils'; | ||
import { wrapDemoWithFn } from 'dumi/tech-stack-utils'; | ||
import type { IDumiTechStackRuntimeOpts } from 'dumi/tech-stack-utils'; | ||
import { defineTechStack, wrapDemoWithFn } from 'dumi/tech-stack-utils'; | ||
import hashId from 'hash-sum'; | ||
import type { Element } from 'hast'; | ||
import { logger } from 'umi/plugin-utils'; | ||
|
||
export default class VueSfcTechStack implements IDumiTechStack { | ||
name = 'vue3-sfc'; | ||
runtimeOpts!: IDumiTechStackRuntimeOpts; | ||
|
||
constructor(runtimeOpts: IDumiTechStackRuntimeOpts) { | ||
this.runtimeOpts = runtimeOpts; | ||
} | ||
|
||
isSupported(_: Element, lang: string) { | ||
return ['vue'].includes(lang); | ||
} | ||
|
||
onBlockLoad( | ||
args: IDumiTechStackOnBlockLoadArgs, | ||
): IDumiTechStackOnBlockLoadResult | null { | ||
if (!args.path.endsWith('.vue')) return null; | ||
const result = compiler.compileSFC({ | ||
id: args.path, | ||
code: args.entryPointCode, | ||
filename: args.filename, | ||
}); | ||
return { | ||
type: 'tsx', | ||
content: Array.isArray(result) ? '' : result.js, | ||
}; | ||
} | ||
export const VueSfcTechStack = (runtimeOpts: IDumiTechStackRuntimeOpts) => | ||
defineTechStack({ | ||
name: 'vue3-sfc', | ||
runtimeOpts, | ||
isSupported(_, lang: string) { | ||
return ['vue'].includes(lang); | ||
}, | ||
onBlockLoad(args) { | ||
if (!args.path.endsWith('.vue')) return null; | ||
const result = compiler.compileSFC({ | ||
id: args.path, | ||
code: args.entryPointCode, | ||
filename: args.filename, | ||
}); | ||
return { | ||
type: 'tsx', | ||
content: Array.isArray(result) ? '' : result.js, | ||
}; | ||
}, | ||
transformCode(raw, opts) { | ||
if (opts.type === 'code-block') { | ||
const filename = opts.fileAbsPath; | ||
const id = hashId(raw); | ||
|
||
transformCode(...[raw, opts]: Parameters<IDumiTechStack['transformCode']>) { | ||
if (opts.type === 'code-block') { | ||
const filename = opts.fileAbsPath; | ||
const id = hashId(raw); | ||
const js = compile({ id, filename, code: raw }); | ||
if (Array.isArray(js)) { | ||
logger.error(js); | ||
return ''; | ||
} | ||
|
||
const js = compile({ id, filename, code: raw }); | ||
if (Array.isArray(js)) { | ||
logger.error(js); | ||
return ''; | ||
const code = wrapDemoWithFn(js, { | ||
filename, | ||
parserConfig: { | ||
syntax: 'ecmascript', | ||
}, | ||
}); | ||
return `(${code})()`; | ||
} | ||
|
||
const code = wrapDemoWithFn(js, { | ||
filename, | ||
parserConfig: { | ||
syntax: 'ecmascript', | ||
}, | ||
}); | ||
return `(${code})()`; | ||
} | ||
return raw; | ||
} | ||
} | ||
return raw; | ||
}, | ||
}); |