CODEWITHSUNDEEP
vuetify.jsvue-clivue-cli-3vue-cli-4vuetify-loader
Joseph
Joseph

Reputation: 4705

Why vue-cli understand I've installed vue-cli-plugin-vuetify and vuetify-loader?

When I create a fresh vue-cli project via this command

vue create hello-word

and this command to install vuetify

vue add vuetify

Then I saw my git changes like this

enter image description here

Two new dependencies have been installed in package.json.

  1. vue-cli-plugin-vuetify
  2. vuetify-loader

At first glance, I thought vue.config.js has specified using these two, but it's content only have these code.

module.exports = {
  "transpileDependencies": [
    "vuetify"
  ]
}

So, how does vue-cli know I've installed this new vuetify loader?

Does it automatically pick those up?

Upvotes: 2

Views: 3998

Answers (2)

ahmnouira
ahmnouira

Reputation: 3411

After running vue add vuetify choose Vuetify 3 if you are using Vue 3:

Upvotes: 1

MAW
MAW

Reputation: 973

vuetify-loader is a treeshaking plugin for Webpack. It gets installed automatically when you install Vuetify using "vue add vuetify".

So, vuetify-loader is used by Webpack for treeshaking the Vuetify components to only include the ones that you imported in your app. This way Webpack should be able to lower your build size by importing only the required components, and not all the Vuetify components.

See Vuetify Treeshaking

And this is the vuetify-loader project on Github

Upvotes: 0

Related Questions