Menu
I am trying to get an app up and running with Vue 2 and everything was fine until I tried using the node-sass and sass-loader packages. I started getting errors and after investigation, it looks like I need to be using webpack 5+ for the latest node-sass package to work. After poking around it looks like when I created the project it defaulted to webpack version 4.46.0.
I updated my vue-cli to the latest version as per the instructions on the official page and then tried re-initializing a new project and still have the same issue. Currently, I have @vue/cli 4.5.12 which looks to be the latest (I think).
I am initializing the app with vue create <app-name> and I am using the default configs. I did find this page which says "migrating from v4" which perhaps implies there might be a higher version of vue-cli but again I followed all the instructions to no avail, so not sure if I am just missing something here.
I am pretty novice in Vue and not sure what additional info I should provide to make this useful, but I've searched all over and for the life of me cannot figure out what is going on.
601
vue extension, we use a default app entry to load the given component, otherwise we treat it as a normal webpack entry.
Vue CLI is built on top of Webpack and so for beginners, you do not need to know what Webpack is as the Vue CLI has taken care of the configurations with great default presets and you literally need 0 configs to start.
The vue-cli-service serve command starts a dev server (based on webpack-dev-server) that comes with Hot-Module-Replacement (HMR) working out of the box.
From what I found out on GitHub, the latest stable version - 4.5.12 - of Vue CLI still uses Webpack 4: https://github.com/vuejs/vue-cli/blob/v4.5.12/package.json .
Considering that, the easiest solution in my opinion would be to just downgrade sass-loader to version 10 with npm install sass-loader@10 for example, as suggested here: https://stackoverflow.com/a/66087132/1505369.
You could try using a beta version of vue-cli, as I tried, by updating both @vue/cli-service and, I believe, all the vue-cli plugins to version 5.0.0-beta.0, with npm install @vue/[email protected] @vue/[email protected] @vue/[email protected] @vue/[email protected]. It should end up installing and using Webpack 5. For me personally though, it hasn't really solved the issue, as the new error occurred:
ERROR TypeError: The 'compilation' argument must be an instance of Compilation TypeError: The 'compilation' argument must be an instance of Compilation
// ...
67
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
