Solve the loader problem of projects created by vue-cli
Below I will share with you an article that solves the loader problem of vue-cli creation project. It has a good reference value and I hope it will be helpful to everyone.
When using the vue-cli project to create a project, when using pre-compiled css languages such as sass, you do not need to configure it in the config, you only need to install the corresponding loader in the project.
For example:
1. Use sass in the project
$ npm i node-sass -D $ npm i sass-loader -D
2. When using vuex, even if vux and vux-loader are installed and vux components are used in the project, the project will not start and the error will be as follows:
These dependencies were not found: * !!vue-style-loader!css-loader?{"minimize":false,"sourceMap":false}!../../../../vue-loader/lib/style-compiler/index?{"vue":true,"id":"da ta-v-28d8bf8a","scoped":false,"hasInlineConfig":false}!../../../../vux-loader/src/after-less-loader.js!less-loader?{"sourceMap":false}!.. /../../../vux-loader/src/style-loader.js!../../../../vue-loader/lib/selector?type=styles&index=0!./index.vue in ./~/vux/src/components/ce ll/index.vue * !!vue-style-loader!css-loader?{"minimize":false,"sourceMap":false}!../../../../vue-loader/lib/style-compiler/index?{"vue":true,"id":"da ta-v-76475f48","scoped":false,"hasInlineConfig":false}!../../../../vux-loader/src/after-less-loader.js!less-loader?{"sourceMap":false}!.. /../../../vux-loader/src/style-loader.js!../../../../vue-loader/lib/selector?type=styles&index=0!./index.vue in ./~/vux/src/components/gr oup/index.vue To install them, you can run: npm install --save !!vue-style-loader!css-loader?{"minimize":false,"sourceMap":false}!../../../../vue-loade r/lib/style-compiler/index?{"vue":true,"id":"data-v-28d8bf8a","scoped":false,"hasInlineConfig":false}!../../../../vux-loader/src/after-le ss-loader.js!less-loader?{"sourceMap":false}!../../../../vux-loader/src/style-loader.js!../../../../vue-loader/lib/selector?type=styles&i ndex=0!./index.vue !!vue-style-loader!css-loader?{"minimize":false,"sourceMap":false}!../../../../vue-loader/lib/style-compiler/index?{"v ue":true,"id":"data-v-76475f48","scoped":false,"hasInlineConfig":false}!../../../../vux-loader/src/after-less-loader.js!less-loader?{"sou rceMap":false}!../../../../vux-loader/src/style-loader.js!../../../../vue-loader/lib/selector?type=styles&index=0!./index.vue > Listening at http://localhost:8080
At a glance, I can confirm that there is a problem with the loader, but I have installed the dependencies for sass compilation and still cannot solve the error.
Later I checked the vux package and found that the component used less, so I installed the less dependency to solve the problem.
The above is what I compiled for everyone. I hope it will be helpful to everyone in the future.
Related articles:
Angular study notes: examples of integrating third-party UI frameworks and controls
Node.js implementation registration Example of how to activate the email function
Detailed explanation of Webpack’s babel-loader file preprocessor
The above is the detailed content of Solve the loader problem of projects created by vue-cli. For more information, please follow other related articles on the PHP Chinese website!

Hot AI Tools

Undresser.AI Undress
AI-powered app for creating realistic nude photos

AI Clothes Remover
Online AI tool for removing clothes from photos.

Undress AI Tool
Undress images for free

Clothoff.io
AI clothes remover

Video Face Swap
Swap faces in any video effortlessly with our completely free AI face swap tool!

Hot Article

Hot Tools

Notepad++7.3.1
Easy-to-use and free code editor

SublimeText3 Chinese version
Chinese version, very easy to use

Zend Studio 13.0.1
Powerful PHP integrated development environment

Dreamweaver CS6
Visual web development tools

SublimeText3 Mac version
God-level code editing software (SublimeText3)

Hot Topics

With the popularity of Douyin, more and more individuals and companies have begun to pay attention to the Douyin account matrix. The Douyin account matrix refers to the creation of multiple related accounts to form an organic whole to achieve the purpose of expanding brand influence and improving user stickiness. So, what are the benefits of Douyin account matrix? What is the purpose of making a Douyin account matrix? This article explores these issues in detail. 1. What are the benefits of Douyin account matrix? Increase brand exposure: By creating multiple Douyin accounts, brand information can reach more potential users, helping to increase the brand's visibility and reputation. Improve content exposure: Using Douyin’s recommendation algorithm to publish content through multiple accounts can increase the exposure opportunities of brands and products and improve their visibility on the platform. 3. Achieve precision

Vue-cli3.0 is a new scaffolding tool based on Vue.js. It can help us quickly create a Vue project and provides many convenient tools and configurations. Below we will introduce step by step the steps and process of creating a project using Vue-cli3.0. To install Vue-cli3.0, you first need to install Vue-cli3.0 globally. You can install it through npm: npminstall-g@vue/cli

Vue-cli is a scaffolding tool officially provided by Vue.js to build Vue projects. By using Vue-cli, you can quickly build the basic skeleton of a Vue project, allowing developers to focus on the implementation of business logic without spending a lot of time. To configure the basic environment of the project. This article will introduce the basic usage of Vue-cli and commonly used plug-in recommendations, aiming to provide a guide to the use of Vue-cli for beginners. 1. Basic usage of Vue-cli Install Vue-cli

Vue is a popular front-end framework favored by many developers for its flexibility and ease of use. In order to better develop Vue applications, the Vue team has developed a powerful tool-Vue-cli, which makes it easier to develop Vue applications. This article will introduce you to the use of Vue-cli in detail. 1. Install Vue-cli Before using Vue-cli, you need to install it first. First, you need to make sure you have Node.js installed. Then, install Vue-c using npm

Instructions for using Vue-cli scaffolding tools and project configuration. With the continuous development of front-end technology, front-end frameworks are attracting more and more attention from developers. As a leader in front-end frameworks, Vue.js has been widely used in the development of various web applications. Vue-cli is a command line-based scaffolding officially provided by Vue.js. It can help developers quickly initialize the Vue.js project structure, allowing us to focus more on business development. This article will introduce the installation and installation of Vue-cli

The main purpose of establishing a computer network is to realize the sharing of computer resources; resource sharing refers to the simultaneous use of hardware and software resources by multiple computers or multiple users in the same computer in the network. To achieve resource sharing, it must be coordinated by the operating system manage.

The specific method is as follows: 1. Create the backend server object upstreammixVueServer{serverbaidu.com;#This is your own server domain name} 2. Create the access port and reverse proxy rule server{listen8082;server_namelocalhost;location/{rootE:/mix_vue/dist;# Locate the directory of the project#indexindex.htmlindex.htm;try_files$uri$uri//index.html;#Configure according to the rules of the official website}location~\.php${proxy_p

Technologies used: 1. vue.js, the core of the vue-cli project, whose main features are two-way data binding and component systems; 2. vue-router, the routing framework; 3. vuex, the state manager for vue application project development ; 4. axios, used to initiate http requests such as GET or POST; 5. vux, a mobile UI component library specially designed for vue; 6. emit.js, used to manage the vue event mechanism; 7. webpack, module Load and vue-cli project packager.
