Solve the problem of using less in Vue

1. Install less dependency: npm install less less-loader --save

2. Modify the webpack.base.config.js file, configure the loader to load dependencies, make it support external less, and add to the original code

// This method displays the style tag style in the console { 
    test: /\.less$/,

    loader: "style-loader!css-loader!less-loader",
　
   options: { sourceMap: true } //You can see in the console which less file the current tag style comes from} 

3. Use in the project

Add lang="less" to the style tag in the vue file to use less in the tag, or import less externally

Problems encountered:

Cause: The installed version of less-loader is too high. Solution:

1.npm uninstall less-loader 2.npm install [email protected]

Or just modify the version number in the package.json file and then npm install

This is the end of this article about the use of less in vue. For more relevant content on the use of vue less, please search for previous articles on 123WORDPRESS.COM or continue to browse the following related articles. I hope everyone will support 123WORDPRESS.COM in the future!