vue怎么引入外部样式文件，比如.css .scss .less

Vue 可以使用 import 或 require 引入外部样式文件，具体步骤如下：

1. 在 Vue 组件中的 `<template>` 标签中使用引入样式文件的标签，通常是在根元素的 class 上加上样式类名，如下所示：

<template>
  <div class="my-class">
    ...
  </div>
</template>

2. 在 Vue 组件的 `<script>` 标签中引入样式文件，通常是使用 import 或 require 语句，在组件代码前面引入，如下所示：

<script>
  import 'path/to/your/style.css';

  export default {
    // 组件代码
  }
</script>

或者：

<script>
  require('path/to/your/style.css');

  export default {
    // 组件代码
  }
</script>

3. 注意，如果是引入 LESS 或 SCSS 文件，需要安装对应的预处理器和 loader，如 less-loader 或 sass-loader，并在 webpack 配置文件中进行相关配置。如下所示：

// webpack.config.js
module.exports = {
  ...
  module: {
    rules: [
      {
        test: /\.less$/,
        use: [
          {
            loader: 'less-loader',
            options: {
              javascriptEnabled: true
            }
          }
        ]
      }
    ]
  }
}

4. 如果是在全局范围引入样式文件，可以在 Vue 应用的入口文件（如 `main.js`）中使用 import 或 require 引入样式文件，通常是在根元素的 class 上加上样式类名，如下所示：

import 'path/to/your/style.css';

new Vue({
  el: '#app',
  render: h => h(App)
})

或者：

require('path/to/your/style.css');

new Vue({
  el: '#app',
  render: h => h(App)
})