[Question] How to exclude certain folders/files with glob pagesDir?

[eth3lbert]

Thats say with the following folder structure:

-- src/
---- pages/
------- index/
--------- _components/*.{vue,js}  (ignore
--------- _layouts/*.{vue,js}  (ignore
--------- index.vue
--------- other.vue
--------- _underscore/*.{vue.js} (keep
--------- _other_underscore.vue (keep

How do we ignore files in _components and _layouts but keep files in _underscores/ and _other_underscore.vue?

[brattonross]

Hey thanks for your question.

I think this should be possible since we pass { extended: true } to the glob-to-regexp options, which means that you can use bash-like globs (e.g. character ranges [a-z] and brace expansion {*.js,*.vue}) to construct a glob that does the job. For your example I found that src/pages/index/{[a-zA-Z]*.vue,_underscore/*.vue,_other*.vue} did the job, although I'm not that experienced with glob/regex so there may be a nicer way.

I will admit that it is not great to have to construct a complex glob in order to ignore some files and/or folders, so I'd like to investigate some ways in which we could make this experience better.

If we take a look at the options that Nuxt provides for example, they offer the ability to prefix a file with a string to ignore it, or you can pass an array of globs that should be ignored. We could also do something similar. Another approach could be to let the user explicitly list the files that they want to use as pages as you suggested in #12, or even let them pass a function that resolves the files. This would invert the control of fetching pages to the user which could be useful. There's a bunch of options so I'd like some time to think about what I'd like the API of the plugin to look like.

Lastly there is always the option of structuring your app differently, I built this library with the typical Nuxt/Next style app in mind where you have just your pages in the pages directory.

[brattonross]

After some thought, I quite like the idea of supporting an ignore or exclude array which takes a list of paths/globs. You could then do something like this to satisfy your example:

voie({
  exclude: ['src/pages/**/{_components,_layouts}/*']
})

[eth3lbert]

Yes, the ignore or exclude and globs array will be much helpful for sure.

BTW, the proposed files option in #12 can just pass the glob result as value which let user do the resolve work themself.

[brattonross]

I've added support for an exclude option, it will be available from v0.7.0 😀