Skip to content
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

For Vue CLI projects that use aliases, plugin will not resolve alias imports #5

Closed
jackkoppa opened this issue Jan 7, 2020 · 0 comments
Closed
Assignees

Comments

@jackkoppa
Copy link
Member

@jackkoppa jackkoppa commented Jan 7, 2020

For a component that looks like this:

// src/components/SomeComponent.vue

import loadingMixin from '@/mixins/loadingMixin' // located at 'src/mixins/loadingMixin.js'

export default {
  mixins: [loadingMixin]
  // other component instance options
}

And then running the Zeplin CLI with this plugin, zeplin connect -p zeplin-cli-connect-plugin-vue, user will see an error like the following:

Neither '@/mixins/loadingMixin.vue' nor '@/mixins/loadingMixin.js(x)' or '@/mixins/loadingMixin/index.js(x)' or '@/mixins/loadingMixin/index.ts(x)' could be found in 'src/components/SomeComponent'

This is even though the alias for '@': 'src' has already been defined correctly for the Vue CLI project. Same issue for other custom aliases, e.g. if we had defined in vue.config.js that '@mixin': 'src/mixin'

Fortunately, vue-docgen-api provides an option when running parse, to pass in the aliases that should be used when resolving imports. i.e. the docgen API can resolve imports the same way Webpack does, if we know how to get the Webpack aliases for it.
For now, to cover the most common-by-far use-case, we will just support aliases defined by Vue CLI projects, and at least not fail in other cases. We could support non-CLI cases in the future.

References:

  1. vue-docgen-api alias support: https://vue-styleguidist.github.io/docs/Docgen.html#alias
  2. Getting the computed Webpack config from Vue CLI projects: https://cli.vuejs.org/guide/webpack.html#using-resolved-config-as-a-file
@jackkoppa jackkoppa self-assigned this Jan 7, 2020
jackkoppa added a commit that referenced this issue Jan 7, 2020
jackkoppa added a commit that referenced this issue Jan 7, 2020
fix (#5): Reference computed Vue CLI Webpack config, when available, for import aliases
@jackkoppa jackkoppa closed this Jan 7, 2020
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Linked pull requests

Successfully merging a pull request may close this issue.

None yet
1 participant
You can’t perform that action at this time.