Gathering detailed insights and metrics for @vue/component-compiler-utils
An interesting fact about npm is that it started as a weekend project by its creator, Isaac Z. Schlueter, in 2009. It was officially launched in January 2010.
Installations
npm install @vue/component-compiler-utilsScore
85.3
Supply Chain
98.7
Quality
78.9
Maintenance
50
Vulnerability
99.6
License
Releases
14
Contributors
82
![dependabot[bot]](https://avatars.githubusercontent.com/in/29110?v=4){kind=avatar}
Developer
vuejs
Module System
BETA
CommonJS
Statistics
321 Stars
132 Commits
75 Forks
14 Watching
15 Branches
82 Contributors
Updated on 22 Jul 2024
Languages
TypeScript (99.63%)
JavaScript (0.37%)
Total Downloads
Cumulative downloads
Total Downloads
484,068,589
Last day
-1.1%
279,309
Compared to previous day
Last week
0.4%
1,482,156
Compared to previous week
Last month
11.9%
6,225,382
Compared to previous month
Last year
-21.2%
74,627,843
Compared to previous year
Daily Downloads
Weekly Downloads
Monthly Downloads
Yearly Downloads
Dependencies
9
Dev Dependencies
14
Optional Dependencies
1
Versions
@vue/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 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.
1interface ParseOptions { 2 source: string 3 filename?: string 4 compiler: VueTemplateCompiler 5 // https://github.com/vuejs/vue/tree/dev/packages/vue-template-compiler#compilerparsecomponentfile-options 6 // default: { pad: 'line' } 7 compilerParseOptions?: VueTemplateCompilerParseOptions 8 sourceRoot?: string 9 needMap?: boolean 10} 11 12interface SFCDescriptor { 13 template: SFCBlock | null 14 script: SFCBlock | null 15 styles: SFCBlock[] 16 customBlocks: SFCCustomBlock[] 17} 18 19interface SFCCustomBlock { 20 type: string 21 content: string 22 attrs: { [key: string]: string | true } 23 start: number 24 end: number 25 map?: RawSourceMap 26} 27 28interface SFCBlock extends SFCCustomBlock { 29 lang?: string 30 src?: string 31 scoped?: boolean 32 module?: string | boolean 33}
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.
1interface TemplateCompileOptions { 2 source: string 3 filename: string 4 5 compiler: VueTemplateCompiler 6 // https://github.com/vuejs/vue/tree/dev/packages/vue-template-compiler#compilercompiletemplate-options 7 // default: {} 8 compilerOptions?: VueTemplateCompilerOptions 9 10 // Template preprocessor 11 preprocessLang?: string 12 preprocessOptions?: any 13 14 // Transform asset urls found in the template into `require()` calls 15 // This is off by default. If set to true, the default value is 16 // { 17 // audio: 'src', 18 // video: ['src', 'poster'], 19 // source: 'src', 20 // img: 'src', 21 // image: ['xlink:href', 'href'], 22 // use: ['xlink:href', 'href'] 23 // } 24 transformAssetUrls?: AssetURLOptions | boolean 25 26 // For vue-template-es2015-compiler, which is a fork of Buble 27 transpileOptions?: any 28 29 isProduction?: boolean // default: false 30 isFunctional?: boolean // default: false 31 optimizeSSR?: boolean // default: false 32 33 // Whether prettify compiled render function or not (development only) 34 // default: true 35 prettify?: boolean 36} 37 38interface TemplateCompileResult { 39 ast: Object | undefined 40 code: string 41 source: string 42 tips: string[] 43 errors: string[] 44} 45 46interface AssetURLOptions { 47 [name: string]: string | string[] 48}
Handling the Output
The resulting JavaScript code will look like this:
1var render = function (h) { /* ... */} 2var 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.
1interface StyleCompileOptions { 2 source: string 3 filename: string 4 id: string 5 map?: any 6 scoped?: boolean 7 trim?: boolean 8 preprocessLang?: string 9 preprocessOptions?: any 10 postcssOptions?: any 11 postcssPlugins?: any[] 12} 13 14interface StyleCompileResults { 15 code: string 16 map: any | void 17 rawResult: LazyResult | void // raw lazy result from PostCSS 18 errors: string[] 19}
compileStyleAsync(StyleCompileOptions)
Same as compileStyle(StyleCompileOptions) but it returns a Promise resolving to StyleCompileResults. It can be used with async postcss plugins.
No vulnerabilities found.
Reason
no binaries found in the repo
Reason
Found 5/30 approved changesets -- score normalized to 1
Reason
0 commit(s) and 0 issue activity found in the last 90 days -- score normalized to 0
Reason
no effort to earn an OpenSSF best practices badge detected
Reason
license file not detected
Details
- Warn: project does not have a license file
Reason
security policy file not detected
Details
- Warn: no security policy file detected
- Warn: no security file to analyze
- Warn: no security file to analyze
- Warn: no security file to analyze
Reason
project is not fuzzed
Details
- Warn: no fuzzer integrations found
Reason
SAST tool is not run on all commits -- score normalized to 0
Details
- Warn: 0 commits out of 7 are checked with a SAST tool
Reason
45 existing vulnerabilities detected
Details
- Warn: Project is vulnerable to: GHSA-67hx-6x53-jw92
- Warn: Project is vulnerable to: GHSA-93q8-gq69-wqmw
- Warn: Project is vulnerable to: GHSA-grv7-fg5c-xmjg
- Warn: Project is vulnerable to: GHSA-3xgq-45jj-v275
- Warn: Project is vulnerable to: GHSA-gxpj-cx7g-858c
- Warn: Project is vulnerable to: GHSA-w573-4hg7-7wgq
- Warn: Project is vulnerable to: GHSA-ff7x-qrg7-qggm
- Warn: Project is vulnerable to: GHSA-ww39-953v-wcq6
- Warn: Project is vulnerable to: GHSA-765h-qjxv-5f44
- Warn: Project is vulnerable to: GHSA-f2jv-r9rf-7988
- Warn: Project is vulnerable to: GHSA-43f8-2h32-f4cj
- Warn: Project is vulnerable to: GHSA-qqgx-2p2h-9c37
- Warn: Project is vulnerable to: GHSA-896r-f27r-55mw
- Warn: Project is vulnerable to: GHSA-9c47-m6qq-7p4h
- Warn: Project is vulnerable to: GHSA-29mw-wpgm-hmr9
- Warn: Project is vulnerable to: GHSA-35jh-r3h4-6jhm
- Warn: Project is vulnerable to: GHSA-952p-6rrq-rcjv
- Warn: Project is vulnerable to: GHSA-f8q6-p94x-37v3
- Warn: Project is vulnerable to: GHSA-xvch-5gv4-984h
- Warn: Project is vulnerable to: GHSA-5fw9-fq32-wv5p
- Warn: Project is vulnerable to: GHSA-hj48-42vr-x3v9
- Warn: Project is vulnerable to: GHSA-7fh5-64p2-3v2j
- Warn: Project is vulnerable to: GHSA-6fw4-hr69-g3rv
- Warn: Project is vulnerable to: GHSA-p493-635q-r6gr
- Warn: Project is vulnerable to: GHSA-3965-hpx2-q597
- Warn: Project is vulnerable to: GHSA-hrpp-h998-j3pp
- Warn: Project is vulnerable to: GHSA-p8p7-x288-28g6
- Warn: Project is vulnerable to: GHSA-c2qf-rxjj-qqgw
- Warn: Project is vulnerable to: GHSA-4rq4-32rv-6wp6
- Warn: Project is vulnerable to: GHSA-64g7-mvw6-v9qj
- Warn: Project is vulnerable to: GHSA-3f95-r44v-8mrg
- Warn: Project is vulnerable to: GHSA-28xr-mwxg-3qc8
- Warn: Project is vulnerable to: GHSA-9p95-fxvg-qgq2
- Warn: Project is vulnerable to: GHSA-9w5j-4mwv-2wj8
- Warn: Project is vulnerable to: GHSA-jgrx-mgxx-jf9v
- Warn: Project is vulnerable to: GHSA-72xf-g2v4-qvf3
- Warn: Project is vulnerable to: GHSA-7p7h-4mm5-852v
- Warn: Project is vulnerable to: GHSA-38fc-wpqx-33j7
- Warn: Project is vulnerable to: GHSA-5j4c-8p2g-v4jx
- Warn: Project is vulnerable to: GHSA-g3ch-rx76-35fx
- Warn: Project is vulnerable to: GHSA-j8xg-fqg3-53r7
- Warn: Project is vulnerable to: GHSA-6fc8-4gx4-v693
- Warn: Project is vulnerable to: GHSA-3h5v-q93c-6h6q
- Warn: Project is vulnerable to: GHSA-c4w7-xm78-47vh
- Warn: Project is vulnerable to: GHSA-p9pc-299p-vxgp
Score
1.6
/10
Last Scanned on 2024-11-11
The Open Source Security Foundation is a cross-industry collaboration to improve the security of open source software (OSS). The Scorecard provides security health metrics for open source projects.
Learn MoreOther packages similar to @vue/component-compiler-utils
@vue-tea/compiler
0.0.1-beta.14
Vue custom element capability extension library
@trainiac/component-compiler-utils
2.2.0
Lower level utilities for compiling Vue single file components
snowpack-vue2-plugin
0.0.5
Use the [Vue 2 compiler](https://www.npmjs.com/package/vue-template-compiler) & [Vue component compiler utils](https://www.npmjs.com/package/@vue/component-compiler-utils) to build your `.vue` SFC files from source.