JSPM

  • ESM via JSPM
  • ES Module Entrypoint
  • Export Map
  • Keywords
  • License
  • Repository URL
  • TypeScript Types
  • README
  • Created
  • Published
  • Downloads 48527
  • Score
    100M100P100Q151459F
  • License MIT

Run jscodeshift on Vue single file components

Package Exports

  • vue-jscodeshift-adapter

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (vue-jscodeshift-adapter) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

vue-jscodeshift-adapter

Run jscodeshift on Vue single file components

Install

npm install vue-jscodeshift-adapter -D

Usage

The instructions below assume you're familiar with jscodeshift.

1. Create a wrapped transform function

This module wraps the transform() function, enabling it to run on Vue single file components (sfc).

The two main use cases are:

  • a. Modify one or more parts of an sfc
  • b. Run a codemod on just the <script> part of an sfc

a. Modify a sfc's script, template or style

my-transform.js:

const adapt = require('vue-jscodeshift-adapter');

function myTransform(fileInfo, api, options) {
  const script   = fileInfo.script.content;
  const template = fileInfo.template.content;
  const style    = fileInfo.style.content;

  // (transform source somehow)

  fileInfo.script.content   = newScript;
  fileInfo.template.content = newTemplate;
  fileInfo.style.content    = newStyle;
}

module.exports = adapt(myTransform);

b. Run an existing codemod on sfc

After wrapping, you can run jscodeshift-compatible codemods on your sfc because

  1. fileInfo.source will be the content of the sfc's <script>
  2. If transform() returns a string, that string becomes the content of <script>

my-transform.js:

const adapt = require('vue-jscodeshift-adapter');
const someCodemod = require('some-codemod');

module.exports = adapt(someCodemod);

2. Run jscodeshift

$ jscodeshift <path> -t my-transform.js --extensions vue

See jscodeshift readme for more info.

License

MIT