Vue3.x + Vite2.x 入门实战 01：Vite 遇到的坑提示：本篇文章会持续更新，记录Vite相关遇到的坑环

为了记录自己的成长经历，我决定把自己实战遇到的坑记录起来，一来方便日后查阅，二来给后人提供一份帮助。

提示：本篇文章会持续更新，记录Vite相关遇到的坑

环境介绍

大家都熟知开发环境不同，碰到的问题很有可能也不同。为了不给大家带来困恼（跟你配置完全一样，为啥你的可以我的不可以），介绍下我的开发环境

Windows 10
VSCode 1.54.3
Node.js v12.16.1
Vue 3.0.5
Vite 2.0.5
typescript 4.1.3

概要内容：

配置alias无效
main.ts中全局引入样式，使用Sass样式变量提示变量未定义

1. 配置alias无效

报错如下：

解决方法：

// vite.config.ts 添加alias配置即可

resolve: {
      alias: [
        {
          find: '/@',
          replacement: path.resolve(__dirname, './src')
        }
      ]
    },

2. main.ts中全局引入样式，使用Sass样式变量提示变量未定义

报错如下：

解决方法：

// vite.config.ts 添加对应sass变量样式文件配置即可

css: {
      preprocessorOptions: {
        scss: {
          additionalData: `@import "./src/assets/styles/variables";`
        }
      }
    },

以上: 如发现有问题，欢迎留言指出，我及时更正