vue Architecture Docs
Home / File/ compileStyle.spec.ts — vue Source File

compileStyle.spec.ts — vue Source File

Architecture documentation for compileStyle.spec.ts, a typescript file in the vue codebase. 5 imports, 0 dependents.

File typescript SfcCompiler 5 imports

Entity Profile

Dependency Diagram

graph LR
  da888724_2f5b_ce7b_dcaa_5217227b58e9["compileStyle.spec.ts"]
  a74639a8_41f7_d409_723a_4c6194e0c72d["parse.ts"]
  da888724_2f5b_ce7b_dcaa_5217227b58e9 --> a74639a8_41f7_d409_723a_4c6194e0c72d
  9805a097_f548_6bcf_28b2_a636f018a4de["parse"]
  da888724_2f5b_ce7b_dcaa_5217227b58e9 --> 9805a097_f548_6bcf_28b2_a636f018a4de
  1aad1b66_4ff0_fcc3_9eab_fd33ebad4a4c["compileStyle.ts"]
  da888724_2f5b_ce7b_dcaa_5217227b58e9 --> 1aad1b66_4ff0_fcc3_9eab_fd33ebad4a4c
  67f843de_b809_a79f_38cf_cf69959495f7["compileStyle"]
  da888724_2f5b_ce7b_dcaa_5217227b58e9 --> 67f843de_b809_a79f_38cf_cf69959495f7
  c437bb0e_7fd9_ef19_c27f_54f6001eb51d["compileStyleAsync"]
  da888724_2f5b_ce7b_dcaa_5217227b58e9 --> c437bb0e_7fd9_ef19_c27f_54f6001eb51d
  style da888724_2f5b_ce7b_dcaa_5217227b58e9 fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

import { parse } from '../src/parse'
import { compileStyle, compileStyleAsync } from '../src/compileStyle'

test('preprocess less', () => {
  const style = parse({
    source:
      '<style lang="less">\n' +
      '@red: rgb(255, 0, 0);\n' +
      '.color { color: @red; }\n' +
      '</style>\n',
    filename: 'example.vue',
    sourceMap: true
  }).styles[0]

  const result = compileStyle({
    id: 'v-scope-xxx',
    filename: 'example.vue',
    source: style.content,
    map: style.map,
    scoped: false,
    preprocessLang: style.lang
  })

  expect(result.errors.length).toBe(0)
  expect(result.code).toEqual(expect.stringContaining('color: #ff0000;'))
  expect(result.map).toBeTruthy()
})

test('preprocess scss', () => {
  const style = parse({
    source:
      '<style lang="scss">\n' +
      '$red: red;\n' +
      '.color { color: $red; }\n' +
      '</style>\n',
    filename: 'example.vue',
    sourceMap: true
  }).styles[0]
  const result = compileStyle({
    id: 'v-scope-xxx',
    filename: 'example.vue',
    source: style.content,
    map: style.map,
    scoped: false,
    preprocessLang: style.lang
  })

  expect(result.errors.length).toBe(0)
  expect(result.code).toMatch('color: red;')
  expect(result.map).toBeTruthy()
})

test('preprocess sass', () => {
  const style = parse({
    source:
      '<style lang="sass">\n' +
      '$red: red\n' +
      '.color\n' +
      '   color: $red\n' +
      '</style>\n',
// ... (144 more lines)

Domain

Dependencies

Source

Frequently Asked Questions

What does compileStyle.spec.ts do?
compileStyle.spec.ts is a source file in the vue codebase, written in typescript. It belongs to the SfcCompiler domain.
What does compileStyle.spec.ts depend on?
compileStyle.spec.ts imports 5 module(s): compileStyle, compileStyle.ts, compileStyleAsync, parse, parse.ts.
Where is compileStyle.spec.ts in the architecture?
compileStyle.spec.ts is located at packages/compiler-sfc/test/compileStyle.spec.ts (domain: SfcCompiler, directory: packages/compiler-sfc/test).

Analyze Your Own Codebase

Get architecture documentation, dependency graphs, and domain analysis for your codebase in minutes.

Try Supermodel Free