@prepair/require-extension-vue

require-extension-vue

Simple vue file support for Node.js. Mainly for testing purposes.

Template block will be parsed and compiled to a render function which allows us early detection of some possible problems with the template. Script block will be parsed and possibly can go through babel transpilation step. Style block will be ignored and won't be processed for now.

Source maps are supported, both the vue parser (for external script files we generate one) and babel returns source maps which will be merged and inlined in the compiled vue file.

Install

npm install --save-dev @prepair/require-extension-vue

Usage

Can be used the same way as @babel/register.

require('@prepair/require-extension-vue')
const SomeComponent = require('src/components/SomeComponent.vue')

// ...
// do something with the parsed and compiled `SomeComponent`

// enabling permanent caching and babel
require('@prepair/require-extension-vue')({
  permanentCache: true,
  babel: true
})
const OtherComponent = require('src/components/OtherComponent.vue')

// ...
// do something with the parsed and compiled `OtherComponent`

Example: usage with Mocha

mocha --require @prepair/require-extension-vue test

Options

name	type	default	description
babel	boolean / object	false	if true or non empty object then it will transpile the script block via babel. true means that babel will try to load your babel configuration if found otherwise will fallback to babel-preset-env set to current node setting. Via object value you can provide any valid option to babel which could override/extend your babel configuration too.
logLevel	string	warn	logging level: trace/debug/info/warn/error/silent. note that this one can be overriden by REQ_EXT_VUE_LOG_LEVEL
noLogParserErrors	boolean	false	if true no parser errors will be logged in console
noLogTemplateCompilerErrors	boolean	false	if true no template compiler errors will be logged in console
noLogTemplateCompilerTips	boolean	false	if true no template compiler tips will be logged in console
parser.errors.exclude	array	[]	excludes for parser error logs. string or RegExp values are supported. string values will be compared as is, RegExp will call .test(error)
permanentCache	boolean	false	if true enables permanent caching of compiled vue files on the disk
templateCompiler.errors.exclude	array	[]	excludes for template compiler error logs. string or RegExp values are supported. string values will be compared as is, RegExp will call .test(error)
templateCompiler.tips.exclude	array	[]	excludes for template compiler tip logs. string or RegExp values are supported. string values will be compared as is, RegExp will call .test(tip)

Examples

// enable permanent cache
require('@prepair/require-extension-vue')({
  permanentCache: true
})

// enable babel transpilation of script block
require('@prepair/require-extension-vue')({
  babel: true
})

// enable permanent cache + setup babel with custom options
require('@prepair/require-extension-vue')({
  permanentCache: true,
  babel: {
    presets: [
    [
      '@babel/preset-env',
      {
        targets: 'current node'
      }
    ]
  ]
  }
})

Environment Variables

name	description
REQ_EXT_VUE_LOG_LEVEL	values can be trace, debug, info, warn, error and silent. for example if set to info then all errors, warnings and info messages will be logged in the console. the default log level is warn. if set it will override the logLevel option
REQ_EXT_VUE_SILENCE_PARSER_ERRORS	if set to any value, no parser error will be logged in the console. if noLogParserErrors is true then this won't have any effect
REQ_EXT_VUE_SILENCE_TEMPLATE_COMPILER_TIPS	if set to any value, no template compiler error will be logged in the console. if noLogTemplateCompilerErrors is true then this won't have any effect
REQ_EXT_VUE_SILENCE_TEMPLATE_COMPILER_ERRORS	if set to any value, no template compiler tip will be logged in the console. if noLogTemplateCompilerTips is true then this won't have any effect

Examples

# set log level to `debug`
REQ_EXT_VUE_LOG_LEVEL=debug npm test

# silence parser and template compiler errors
# (value can be any string)
REQ_EXT_VUE_SILENCE_PARSER_ERRORS=true REQ_EXT_VUE_SILENCE_TEMPLATE_COMPILER_ERRORS=dummy npm test
 npm test

Related Projects

Taken some ideas from the following projects. Some of them are more robust and supports more use cases. Feel free to check them out.

• @babel/register
• jackmellis/require-extension-hooks-vue and require-extension-hooks
• lixinliang/require-extension-vue
• vue-loader

Development

• Node.js : >= 14.18.3
• npm : ^8.4.1