Vuejs using less

When everything is ready:

The first step:

Install less dependent,

npm install less less---save

Step Two:

Modify the Webpack.config.js file, configure the loader load dependency, let it support external less, add the original code

{  test:/\.less$/,  loader:"style-loader!css-loader!less-loader",},

Now basically the installation is complete, and then in the use of the style tag to add lang= "less" inside can write less code.

The style tag is added scoped to be valid only in this scope

<style lang="less" scoped></style>或者@import ‘./index.less‘; //引入全局less文件

Introduced directly in HTML:

<link rel="stylesheet/less" type="text/css" href="文件路径/styles.less"><script src="文件路径/less.js" type="text/javascript"></script>

Vuejs using less