Skip to content

add pre & post css transform callbacks to customize css transformatio… #146

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 2 commits into from
Jan 26, 2019

Conversation

yohodopo
Copy link
Contributor

@yohodopo yohodopo commented Jan 10, 2019

pre & post css transform callbacks to customize css transformation behavior
Fixes #145, #125 by allowing users to write custom transformers similar to webpack loaders

Copy link
Member

@eddyerburgh eddyerburgh left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Can you add cases to the projects in the e2e/projects/ that demonstrate what this PR is implementing

@yohodopo yohodopo force-pushed the feat/css-transformers branch 2 times, most recently from 16f07a6 to 3c90e82 Compare January 12, 2019 21:32
@yohodopo
Copy link
Contributor Author

Hey @eddyerburgh , I've updated the PR with test cases, can you please look into it. Thanks

…n behavior

Update lib/compilers/helpers/module-name-mapper-helper.js

typo

Co-Authored-By: yohodopo <vamc.anne@gmail.com>

Update lib/compilers/helpers/module-name-mapper-helper.js

typo

Co-Authored-By: yohodopo <vamc.anne@gmail.com>
@eddyerburgh
Copy link
Member

eddyerburgh commented Jan 16, 2019

I agree with this PR, but I think we should make it more general.

The config option should be transform:

{
   jest: { 
    'vue-jest': {
      transform: {
        scss: './custom-transform'
      }
    }
  }
}

And each transform should be a Jest transformer:

// custom-transform.js
module.exports = {
  process(src, filePath, config) {
    // custom transform
  }
}

We could support preProcess and postProcess methods on the transformer that receives the same parameters, to support the functionality you're proposing:

// custom-transform.js
module.exports = {
  process(src, filePath, config) {
    // custom transform
  },
  postProcess(src, filePath, config) {
    // ..
  },
  preProcess(src, filePath, config) {
    // ..
  },
}

So in this PR can you make changes to the API to use transform as the config option, and expect the transforms to be an object that can contain postProcess and preProcess methods.

@yohodopo yohodopo force-pushed the feat/css-transformers branch 3 times, most recently from 9e11c36 to c7a8e4c Compare January 17, 2019 23:23
@yohodopo yohodopo force-pushed the feat/css-transformers branch from c7a8e4c to ad1ebcf Compare January 17, 2019 23:33
@yohodopo
Copy link
Contributor Author

@eddyerburgh, I've updated the PR to make the change generic.

@eddyerburgh
Copy link
Member

Thanks for the changes, I'm going to give this a full review at the weekend

Copy link
Member

@eddyerburgh eddyerburgh left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks, looks good 😄. I'm going to do some refactoring to use style compilation from @vue/component-compiler-utils, so will change the implementation a bit. But I'll keep the functionality you added in this PR.

@eddyerburgh eddyerburgh merged commit 2309253 into vuejs:master Jan 26, 2019
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants