Support Vue

I’m unfortunately stuck with a framework that encourages using non-standard .vue files. Would be amazing if unimported could parse them.

Should be rather easy to implement an MVP version IMO, as the most important part would basically be to just ignore everything outside of the <script> block (as that’s not JS/TS) and interpret the result as (j|t)sx?

---

yarn run v1.22.10
$ ./node_modules/.bin/unimported .
⠙ resolving imports
Failed parsing ./source/SomeVueFile.vue
{
  index: 34,
  lineNumber: 2,
  column: 23,
  message: 'Identifier expected.'
}

[smeijer]

This should work now, albeit in a basic form.

I just strip the content from the <script>...</script> tag using string mutations (because I don’t want to include a heavy html parser), and use that as the source. So there are some limitations. The most important one, both those tags need to stand on their own line! But I think that’s a good convention to use anyways 😅

In other words. This works:

<template>...</template>
<script>
  ...
</script>

This does not:

<template>...</template>
<script>...</script>

I also only support a single <script> tag per .vue file, as vue seems to have that limitation as well;

The example project also does something smart regarding two build targets and aliasing create-api to create-api-client or create-api-server depending on which build config is used. Note that this is something that unimported currently does not support.

To enable support for vue projects, add the .vue extension to your .unimportedrc.json config. For example, this is the config I used on the hackernews project:

{
  "entry": ["src/entry-client.js", "src/entry-server.js"],
  "extensions": [".js", ".vue"],
  "aliases": {
    "create-api": ["./src/api/create-api-client"]
  }
}

Please let me know if this works for you. (support added in v1.17.0)

[FlorianWendelborn]

@smeijer I can confirm that upgrading to 1.18.0 and removing the previous patch-package patch still works as expected. Thanks for the fix