aboutsummaryrefslogtreecommitdiff
path: root/node_modules/@vue/component-compiler-utils/README.md
diff options
context:
space:
mode:
Diffstat (limited to 'node_modules/@vue/component-compiler-utils/README.md')
-rw-r--r--node_modules/@vue/component-compiler-utils/README.md146
1 files changed, 146 insertions, 0 deletions
diff --git a/node_modules/@vue/component-compiler-utils/README.md b/node_modules/@vue/component-compiler-utils/README.md
new file mode 100644
index 00000000..be3c45e3
--- /dev/null
+++ b/node_modules/@vue/component-compiler-utils/README.md
@@ -0,0 +1,146 @@
+# @vue/component-compiler-utils [![Build Status](https://circleci.com/gh/vuejs/component-compiler-utils/tree/master.svg?style=shield)](https://circleci.com/gh/vuejs/component-compiler-utils/)
+
+> Lower level utilities for compiling Vue single file components
+
+This package contains lower level utilities that you can use if you are writing a plugin / transform for a bundler or module system that compiles Vue single file components into JavaScript. It is used in [vue-loader](https://github.com/vuejs/vue-loader) version 15 and above.
+
+The API surface is intentionally minimal - the goal is to reuse as much as possible while being as flexible as possible.
+
+## Why isn't `vue-template-compiler` a peerDependency?
+
+Since this package is more often used as a low-level utility, it is usually a transitive dependency in an actual Vue project. It is therefore the responsibility of the higher-level package (e.g. `vue-loader`) to inject `vue-template-compiler` via options when calling the `parse` and `compileTemplate` methods.
+
+Not listing it as a peer depedency also allows tooling authors to use a non-default template compiler instead of `vue-template-compiler` without having to include it just to fullfil the peer dep requirement.
+
+## API
+
+### parse(ParseOptions): SFCDescriptor
+
+Parse raw single file component source into a descriptor with source maps. The actual compiler (`vue-template-compiler`) must be passed in via the `compiler` option so that the specific version used can be determined by the end user.
+
+``` ts
+interface ParseOptions {
+ source: string
+ filename?: string
+ compiler: VueTemplateCompiler
+ // https://github.com/vuejs/vue/tree/dev/packages/vue-template-compiler#compilerparsecomponentfile-options
+ // defualt: { pad: 'line' }
+ compilerParseOptions?: VueTemplateCompilerParseOptions
+ sourceRoot?: string
+ needMap?: boolean
+}
+
+interface SFCDescriptor {
+ template: SFCBlock | null
+ script: SFCBlock | null
+ styles: SFCBlock[]
+ customBlocks: SFCCustomBlock[]
+}
+
+interface SFCCustomBlock {
+ type: string
+ content: string
+ attrs: { [key: string]: string | true }
+ start: number
+ end: number
+ map?: RawSourceMap
+}
+
+interface SFCBlock extends SFCCustomBlock {
+ lang?: string
+ src?: string
+ scoped?: boolean
+ module?: string | boolean
+}
+```
+
+### compileTemplate(TemplateCompileOptions): TemplateCompileResults
+
+Takes raw template source and compile it into JavaScript code. The actual compiler (`vue-template-compiler`) must be passed in via the `compiler` option so that the specific version used can be determined by the end user.
+
+It can also optionally perform pre-processing for any templating engine supported by [consolidate](https://github.com/tj/consolidate.js/).
+
+``` ts
+interface TemplateCompileOptions {
+ source: string
+ filename: string
+
+ compiler: VueTemplateCompiler
+ https://github.com/vuejs/vue/tree/dev/packages/vue-template-compiler#compilercompiletemplate-options
+ // default: {}
+ compilerOptions?: VueTemplateCompilerOptions
+
+ // Template preprocessor
+ preprocessLang?: string
+ preprocessOptions?: any
+
+ // Transform asset urls found in the template into `require()` calls
+ // This is off by default. If set to true, the default value is
+ // {
+ // video: ['src', 'poster'],
+ // source: 'src',
+ // img: 'src',
+ // image: 'xlink:href'
+ // }
+ transformAssetUrls?: AssetURLOptions | boolean
+
+ // For vue-template-es2015-compiler, which is a fork of Buble
+ transpileOptions?: any
+
+ isProduction?: boolean // default: false
+ isFunctional?: boolean // default: false
+ optimizeSSR?: boolean // default: false
+}
+
+interface TemplateCompileResult {
+ code: string
+ source: string
+ tips: string[]
+ errors: string[]
+}
+
+interface AssetURLOptions {
+ [name: string]: string | string[]
+}
+```
+
+#### Handling the Output
+
+The resulting JavaScript code will look like this:
+
+``` js
+var render = function (h) { /* ... */}
+var staticRenderFns = [function (h) { /* ... */}, function (h) { /* ... */}]
+```
+
+It **does NOT** assume any module system. It is your responsibility to handle the exports, if needed.
+
+### compileStyle(StyleCompileOptions)
+
+Take input raw CSS and applies scoped CSS transform. It does NOT handle pre-processors. If the component doesn't use scoped CSS then this step can be skipped.
+
+``` ts
+interface StyleCompileOptions {
+ source: string
+ filename: string
+ id: string
+ map?: any
+ scoped?: boolean
+ trim?: boolean
+ preprocessLang?: string
+ preprocessOptions?: any
+ postcssOptions?: any
+ postcssPlugins?: any[]
+}
+
+interface StyleCompileResults {
+ code: string
+ map: any | void
+ rawResult: LazyResult | void // raw lazy result from PostCSS
+ errors: string[]
+}
+```
+
+### compileStyleAsync(StyleCompileOptions)
+
+Same as `compileStyle(StyleCompileOptions)` but it returns a Promise resolving to `StyleCompileResults`. It can be used with async postcss plugins.