Search code examples
typescriptvue.jsvuejs2vue-cli

Multiple VueJS TypeScript projects with a common library


I'm building two VueJS applications in TypeScript, one is a client for the public to use, and the other is an admin tool the only I can use to edit the data displayed on the client. I'm using vue-cli and running a simple npm run serve to build and test my applications.

I'm duplicating A LOT of code and I'd like to move my typescript models and services files to a common library that can be accessed by both projects but I can't seem to figure out how to set this up. I've seen only a couple TypeScript common library examples online but none of them match my exact situation and I can't seem to translate them to the VueJS world.

I'd rather not go the NPM package route since that seems like overkill for something this simple.


Solution

  • I was able to cobble together a solution using this persons blog post. It took me forever to figure out how to manage it though.

    One problem I had was with the way this person was using the config.plugin('html) call in their chainWebpack config since my file layout wasn't the same as theirs. I now officially have 2 vuejs typescript projects sharing references with a third typescript project without having to build an NPM package.