Skip to content

Commit

Permalink
wip: port @vue/component-compiler-utils
Browse files Browse the repository at this point in the history
  • Loading branch information
yyx990803 committed Jun 10, 2022
1 parent 50f2870 commit 06594f6
Show file tree
Hide file tree
Showing 30 changed files with 2,164 additions and 251 deletions.
5 changes: 4 additions & 1 deletion .github/workflows/ci.yml
Expand Up @@ -26,7 +26,7 @@ jobs:
- name: Run unit tests
run: pnpm run test:unit

ssr-test:
ssr-sfc-test:
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v2
Expand All @@ -45,6 +45,9 @@ jobs:
- name: Run SSR tests
run: pnpm run test:ssr

- name: Run compiler-sfc tests
run: pnpm run test:sfc

e2e-test:
runs-on: ubuntu-latest
steps:
Expand Down
3 changes: 1 addition & 2 deletions api-extractor.tsconfig.json
Expand Up @@ -3,6 +3,5 @@
"compilerOptions": {
"baseUrl": "./temp",
"types": []
},
"include": ["src"]
}
}
37 changes: 19 additions & 18 deletions package.json
Expand Up @@ -41,10 +41,11 @@
"dev:compiler": "rollup -w -c scripts/config.js --environment TARGET:compiler ",
"build": "node scripts/build.js",
"build:ssr": "npm run build -- runtime-cjs,server-renderer",
"build:types": "rimraf temp && tsc --declaration --emitDeclarationOnly --outDir temp && api-extractor run",
"test": "npm run ts-check && npm run test:types && npm run test:unit && npm run test:e2e && npm run test:ssr",
"build:types": "rimraf temp && tsc --declaration --emitDeclarationOnly --outDir temp && api-extractor run && api-extractor run -c packages/compiler-sfc/api-extractor.json",
"test": "npm run ts-check && npm run test:types && npm run test:unit && npm run test:e2e && npm run test:ssr && npm run test:sfc",
"test:unit": "vitest run test/unit",
"test:ssr": "npm run build:ssr && vitest run server-renderer",
"test:sfc": "vitest run compiler-sfc",
"test:e2e": "npm run build -- full-prod,server-renderer-basic && vitest run test/e2e",
"test:transition": "karma start test/transition/karma.conf.js",
"test:types": "npm run build:types && tsc -p ./types/tsconfig.json",
Expand Down Expand Up @@ -85,45 +86,45 @@
"csstype": "^3.1.0"
},
"devDependencies": {
"@microsoft/api-extractor": "^7.24.2",
"@microsoft/api-extractor": "^7.25.0",
"@rollup/plugin-alias": "^3.1.9",
"@rollup/plugin-commonjs": "^22.0.0",
"@rollup/plugin-node-resolve": "^13.2.1",
"@rollup/plugin-node-resolve": "^13.3.0",
"@rollup/plugin-replace": "^4.0.0",
"@types/he": "^1.1.2",
"@types/node": "^17.0.30",
"chalk": "^4.0.0",
"@types/node": "^17.0.41",
"chalk": "^4.1.2",
"conventional-changelog-cli": "^2.2.2",
"cross-spawn": "^7.0.3",
"de-indent": "^1.0.2",
"enquirer": "^2.3.6",
"esbuild": "^0.14.39",
"execa": "^4.0.0",
"esbuild": "^0.14.43",
"execa": "^4.1.0",
"he": "^1.2.0",
"jasmine-core": "^4.1.1",
"jasmine-core": "^4.2.0",
"jsdom": "^19.0.0",
"karma": "^6.3.20",
"karma-chrome-launcher": "^3.1.1",
"karma-cli": "^2.0.0",
"karma-esbuild": "^2.2.4",
"karma-jasmine": "^5.0.1",
"lint-staged": "^12.4.1",
"lint-staged": "^12.5.0",
"postcss": "^8.4.14",
"lodash": "^4.17.21",
"marked": "^4.0.6",
"marked": "^4.0.16",
"minimist": "^1.2.6",
"prettier": "^2.6.2",
"puppeteer": "^14.1.1",
"puppeteer": "^14.3.0",
"rimraf": "^3.0.2",
"rollup": "^2.70.2",
"rollup": "^2.75.6",
"rollup-plugin-typescript2": "^0.31.2",
"semver": "^7.3.7",
"shelljs": "^0.8.5",
"terser": "^5.13.1",
"terser": "^5.14.0",
"todomvc-app-css": "^2.4.2",
"ts-node": "^10.7.0",
"ts-node": "^10.8.1",
"tslib": "^2.4.0",
"typescript": "^4.6.4",
"vitest": "^0.12.6",
"typescript": "^4.7.3",
"vitest": "^0.12.10",
"yorkie": "^2.0.0"
}
}
64 changes: 64 additions & 0 deletions packages/compiler-sfc/api-extractor.json
@@ -0,0 +1,64 @@
{
"$schema": "https://developer.microsoft.com/json-schemas/api-extractor/v7/api-extractor.schema.json",

"projectFolder": ".",

"mainEntryPointFilePath": "../../temp/packages/compiler-sfc/src/index.d.ts",

"compiler": {
"tsconfigFilePath": "../../api-extractor.tsconfig.json"
},

"dtsRollup": {
"enabled": true,
"untrimmedFilePath": "",
"publicTrimmedFilePath": "./dist/compiler-sfc.d.ts"
},

"apiReport": {
"enabled": false
},

"docModel": {
"enabled": false
},

"tsdocMetadata": {
"enabled": false
},

"messages": {
"compilerMessageReporting": {
"default": {
"logLevel": "warning"
}
},

"extractorMessageReporting": {
"default": {
"logLevel": "warning",
"addToApiReportFile": true
},

"ae-missing-release-tag": {
"logLevel": "none"
},
"ae-internal-missing-underscore": {
"logLevel": "none"
},
"ae-forgotten-export": {
"logLevel": "none"
}
},

"tsdocMessageReporting": {
"default": {
"logLevel": "warning"
},

"tsdoc-undefined-tag": {
"logLevel": "none"
}
}
}
}
27 changes: 16 additions & 11 deletions packages/compiler-sfc/package.json
Expand Up @@ -8,23 +8,28 @@
"dist"
],
"dependencies": {
"@babel/parser": "^7.16.4",
"source-map": "^0.6.1",
"postcss": "^8.1.10"
"@babel/parser": "^7.18.4",
"postcss": "^8.4.14",
"source-map": "^0.6.1"
},
"devDependencies": {
"@babel/types": "^7.18.4",
"@types/estree": "^0.0.48",
"@babel/types": "^7.16.0",
"@types/lru-cache": "^5.1.0",
"estree-walker": "^2.0.2",
"magic-string": "^0.25.7",
"pug": "^3.0.1",
"sass": "^1.26.9",
"@types/hash-sum": "^1.0.0",
"@types/lru-cache": "^5.1.1",
"@vue/consolidate": "^0.17.3",
"de-indent": "^1.0.2",
"estree-walker": "^2.0.2",
"hash-sum": "^2.0.0",
"less": "^4.1.3",
"lru-cache": "^5.1.1",
"magic-string": "^0.25.9",
"merge-source-map": "^1.1.0",
"postcss-modules": "^4.0.0",
"postcss-selector-parser": "^6.0.4"
"postcss-modules": "^4.3.1",
"postcss-selector-parser": "^6.0.10",
"pug": "^3.0.2",
"sass": "^1.52.3",
"stylus": "^0.58.1",
"vue-template-es2015-compiler": "^1.9.1"
}
}
143 changes: 143 additions & 0 deletions packages/compiler-sfc/src/compileStyle.ts
@@ -0,0 +1,143 @@
const postcss = require('postcss')
import { ProcessOptions, LazyResult } from 'postcss'
import trimPlugin from './stylePlugins/trim'
import scopedPlugin from './stylePlugins/scoped'
import {
processors,
StylePreprocessor,
StylePreprocessorResults
} from './stylePreprocessors'

export interface StyleCompileOptions {
source: string
filename: string
id: string
map?: any
scoped?: boolean
trim?: boolean
preprocessLang?: string
preprocessOptions?: any
postcssOptions?: any
postcssPlugins?: any[]
}

export interface AsyncStyleCompileOptions extends StyleCompileOptions {
isAsync?: boolean
}

export interface StyleCompileResults {
code: string
map: any | void
rawResult: LazyResult | void
errors: string[]
}

export function compileStyle(
options: StyleCompileOptions
): StyleCompileResults {
return doCompileStyle({ ...options, isAsync: false })
}

export function compileStyleAsync(
options: StyleCompileOptions
): Promise<StyleCompileResults> {
return Promise.resolve(doCompileStyle({ ...options, isAsync: true }))
}

export function doCompileStyle(
options: AsyncStyleCompileOptions
): StyleCompileResults {
const {
filename,
id,
scoped = true,
trim = true,
preprocessLang,
postcssOptions,
postcssPlugins
} = options
const preprocessor = preprocessLang && processors[preprocessLang]
const preProcessedSource = preprocessor && preprocess(options, preprocessor)
const map = preProcessedSource ? preProcessedSource.map : options.map
const source = preProcessedSource ? preProcessedSource.code : options.source

const plugins = (postcssPlugins || []).slice()
if (trim) {
plugins.push(trimPlugin())
}
if (scoped) {
plugins.push(scopedPlugin(id))
}

const postCSSOptions: ProcessOptions = {
...postcssOptions,
to: filename,
from: filename
}
if (map) {
postCSSOptions.map = {
inline: false,
annotation: false,
prev: map
}
}

let result, code, outMap
const errors: any[] = []
if (preProcessedSource && preProcessedSource.errors.length) {
errors.push(...preProcessedSource.errors)
}
try {
result = postcss(plugins).process(source, postCSSOptions)

// In async mode, return a promise.
if (options.isAsync) {
return result
.then(
(result: LazyResult): StyleCompileResults => ({
code: result.css || '',
map: result.map && result.map.toJSON(),
errors,
rawResult: result
})
)
.catch(
(error: Error): StyleCompileResults => ({
code: '',
map: undefined,
errors: [...errors, error.message],
rawResult: undefined
})
)
}

// force synchronous transform (we know we only have sync plugins)
code = result.css
outMap = result.map
} catch (e) {
errors.push(e)
}

return {
code: code || ``,
map: outMap && outMap.toJSON(),
errors,
rawResult: result
}
}

function preprocess(
options: StyleCompileOptions,
preprocessor: StylePreprocessor
): StylePreprocessorResults {
return preprocessor(
options.source,
options.map,
Object.assign(
{
filename: options.filename
},
options.preprocessOptions
)
)
}

0 comments on commit 06594f6

Please sign in to comment.