1.安装vue-cli

npm install -g @vue/cli
# 或
yarn global add @vue/cli

2.创建一个项目

vue create demo-vue3
# OR
vue ui 

添加Typescript

vue add typescript

添加typescript后，项目编译报错
先移除vue-cli对typescript的依赖

yarn remove @vue/cli-plugin-typescript
yarn remove typescript

添加路由

npm install vue-router@4

添加vuex

yarn add vuex@next --save

添加sass

yarn add sass -d
yarn add sass-loader -d
//合并
yarn add -D sass-loader sass

在vue.config,js中把css的变量变成全局可使用

css: {
     loaderOptions: {
        sass: {
            additionalData: `@import "@/assets/scss/theme.scss";`
        },
        scss: {
            additionalData: `@import "@/assets/scss/theme.scss";`
        }
    }
}

不同的sass-loader版本对应的关键字：
sass-loader v8-中 :---- “ data ”
sass-loader v8中:---- “ prependData ”
sass-loader v10+中，---- “ additionalData ”