Skip to content
This repository was archived by the owner on Aug 16, 2022. It is now read-only.

Commit ccf7d84

Browse files
committed
feat: Add compileToDescriptorAsync and compileStyleAsync methods
1 parent 880afca commit ccf7d84

File tree

4 files changed

+1390
-27
lines changed

4 files changed

+1390
-27
lines changed

package.json

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -23,11 +23,11 @@
2323
],
2424
"scripts": {
2525
"build": "tsc",
26-
"prepare": "yarn build",
26+
"prepare": "rm -rf dist && npm run build",
27+
"pretest": "npm run build",
2728
"test": "jest",
28-
"pretest": "yarn build",
29-
"changelog": "conventional-changelog -p angular -r 2 -i CHANGELOG.md -s",
30-
"version": "npm run changelog && git add CHANGELOG.md"
29+
"prerelease": "npm run test",
30+
"release": "standard-version -a"
3131
},
3232
"homepage": "https://github.com/vuejs/vue-component-compiler#readme",
3333
"devDependencies": {

src/compiler.ts

Lines changed: 90 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -2,9 +2,11 @@ import {
22
parse,
33
compileTemplate,
44
compileStyle,
5+
compileStyleAsync,
56
SFCBlock,
67
StyleCompileResults,
7-
TemplateCompileResult
8+
TemplateCompileResult,
9+
StyleCompileOptions
810
} from '@vue/component-compiler-utils'
911
import {
1012
VueTemplateCompiler,
@@ -14,10 +16,10 @@ import { AssetURLOptions } from '@vue/component-compiler-utils/dist/templateComp
1416

1517
import postcssModules from 'postcss-modules-sync'
1618
import postcssClean from './postcss-clean'
17-
import hash = require('hash-sum')
1819
import * as fs from 'fs'
1920
import * as path from 'path'
2021

22+
const hash = require('hash-sum')
2123
const templateCompiler = require('vue-template-compiler')
2224

2325
export interface TemplateOptions {
@@ -121,6 +123,49 @@ export class SFCCompiler {
121123
}
122124
}
123125

126+
async compileToDescriptorAsync(
127+
filename: string,
128+
source: string
129+
): Promise<DescriptorCompileResult> {
130+
const descriptor = parse({
131+
source,
132+
filename,
133+
needMap: true,
134+
compiler: templateCompiler
135+
})
136+
137+
const scopeId =
138+
'data-v-' +
139+
(this.template.isProduction
140+
? hash(path.basename(filename) + source)
141+
: hash(filename + source))
142+
143+
const template =
144+
descriptor.template && this.compileTemplate(filename, descriptor.template)
145+
146+
const styles = await Promise.all(
147+
descriptor.styles.map(style =>
148+
this.compileStyleAsync(filename, scopeId, style)
149+
)
150+
)
151+
152+
const { script: rawScript, customBlocks } = descriptor
153+
const script = rawScript && {
154+
code: rawScript.src
155+
? this.read(rawScript.src, filename)
156+
: rawScript.content,
157+
map: rawScript.map
158+
}
159+
160+
return {
161+
scopeId,
162+
template,
163+
styles,
164+
script,
165+
customBlocks
166+
}
167+
}
168+
124169
compileTemplate(
125170
filename: string,
126171
template: SFCBlock
@@ -152,7 +197,28 @@ export class SFCCompiler {
152197
scopeId: string,
153198
style: SFCBlock
154199
): StyleCompileResult {
155-
let tokens = undefined
200+
const { options, prepare } = this.doCompileStyle(filename, scopeId, style)
201+
202+
return prepare(compileStyle(options))
203+
}
204+
205+
async compileStyleAsync(
206+
filename: string,
207+
scopeId: string,
208+
style: SFCBlock
209+
): Promise<StyleCompileResult> {
210+
const { options, prepare } = this.doCompileStyle(filename, scopeId, style)
211+
212+
return prepare(await compileStyleAsync(options))
213+
}
214+
215+
private doCompileStyle(
216+
filename: string,
217+
scopeId: string,
218+
style: SFCBlock
219+
): { options: StyleCompileOptions, prepare: (result: StyleCompileResults) => StyleCompileResult } {
220+
let tokens: any = undefined
221+
156222
const needsCSSModules =
157223
style.module === true || typeof style.module === 'string'
158224
const needsCleanCSS =
@@ -179,26 +245,28 @@ export class SFCCompiler {
179245
this.style.preprocessOptions[style.lang]) ||
180246
{}
181247
const source = style.src ? this.read(style.src, filename) : style.content
182-
const result = compileStyle(<any>{
183-
source: preprocessOptions.data ? `${preprocessOptions.data}\n${source}` : source,
184-
filename,
185-
id: scopeId,
186-
map: style.map,
187-
scoped: style.scoped || false,
188-
postcssPlugins,
189-
postcssOptions: this.style.postcssOptions,
190-
preprocessLang: style.lang,
191-
preprocessOptions,
192-
trim: this.style.trim
193-
})
194-
195248
return {
196-
media: style.attrs.media,
197-
scoped: style.scoped,
198-
moduleName: style.module === true ? '$style' : <any>style.module,
199-
module: tokens,
200-
...result,
201-
code: result.code
249+
options: {
250+
source: preprocessOptions.data ? `${preprocessOptions.data}\n${source}` : source,
251+
filename,
252+
id: scopeId,
253+
map: style.map,
254+
scoped: style.scoped || false,
255+
postcssPlugins,
256+
postcssOptions: this.style.postcssOptions,
257+
preprocessLang: style.lang,
258+
preprocessOptions,
259+
trim: this.style.trim
260+
},
261+
262+
prepare: result => ({
263+
media: style.attrs.media,
264+
scoped: style.scoped,
265+
moduleName: style.module === true ? '$style' : <any>style.module,
266+
module: tokens,
267+
...result,
268+
code: result.code
269+
})
202270
}
203271
}
204272

0 commit comments

Comments
 (0)
pFad - Phonifier reborn

Pfad - The Proxy pFad of © 2024 Garber Painting. All rights reserved.

Note: This service is not intended for secure transactions such as banking, social media, email, or purchasing. Use at your own risk. We assume no liability whatsoever for broken pages.


Alternative Proxies:

Alternative Proxy

pFad Proxy

pFad v3 Proxy

pFad v4 Proxy