@best-shot/preset-vue

A best-shot preset for Vue project.

This preset offer the following features:

• Vue (3.x/2.x) framework support
• Vue Single-File Component (SFC) Spec support
• Vue 3 migration build support

Installation

npm install @best-shot/preset-vue --save-dev

Usage

// example: .best-shot/config.mjs
export const config = {
  presets: ['vue'],
  vue: {
    // shadowMode
    // transformAssetUrls
    // compilerOptions
  }
};

Add CSS/SCSS/LESS support

npm install @best-shot/preset-style --save-dev

// example: .best-shot/config.mjs
export const config = {
  presets: ['style', 'vue']
};

Vue 3 migration build support

npm install @vue/compat --save

@vue/compat will become the alias of vue automatically.

// example: .best-shot/config.mjs
export const config = {
  presets: ['vue'],
  vue: {
    compilerOptions: {
      compatConfig: {
        MODE: 2
      }
    }
  }
};

Tips

Whitespace options override

options.compilerOptions.whitespace of vue-loader is set to condense by default.

See: vue-template-compiler#options

Related

• @best-shot/preset-style
• @best-shot/preset-web
• @best-shot/core