0.1.2 • Published 2 years ago

vue-to-dm v0.1.2

Weekly downloads
-
License
MIT
Repository
github
Last release
2 years ago

Vue to DM

Vue to DM CI Coverage Status

This utility helps to transform Vue SFC files to PwC Digital Maker compatible SFC format:

  • Removing all imports from <script /> blocks.
  • Removing components property from exported default objects.
  • Renaming names of components based on their filenames in underlined_lowercased_style. Usages in templates will also be transformed automatically. These names will be used as registered components in Digital Maker.
  • Combining all style blocks into a single app.css file.

DISCLAMER

  • This utility is NOT a compiler or bundler. Please use Vue CLI, Vite or any other tools to build your project first to make sure everything works. Then use vue-to-dm to transform Vue SFC files.
  • Currently DM uses Vue 2.x, and vue-to-dm doesn't transform any API level source code.
  • vue-to-dm only supports JavaScript as <script /> blocks and CSS as <style /> blocks, TypeScript, SCSS are not supported yet.
  • External libraries, scripts, stylesheets are not bundled.
  • JavaScript is a flexible language, the sample code below might work with vue compiler, but vue-to-dm is a limited utility, please avoid such usage.
import components from "@/components.js";

export default {
  components: {
    ...components,
  }
};

Usage

Install:

npm i vue-to-dm -D

Create your build script:

const { build } = require("./dist/index.js");

build([`/path/to/folders/of/src`], {
	dist_dir: `/path/to/dist/dir`,
});

API:

export const build = (dirs: string[], options: BuildOptions = {}): void;
  • dirs: an array of folders containing SFC files to be transformed.
  • options: dist_dir: target directory which will contain app.css and components directory after build(). prettier: options to format output files with Prettier.