Vue3 脚手架

1. 使用vue-cli创建脚手架

PowerShell
vue create vue3_test       # 创建vue3工程,vue-cli版本必须在4.5.13以上

PowerShell
npm run serve         # 运行工程

2. 使用vite创建脚手架

方式一:

PowerShell
npm init vite-app vue3_test_vite    # 创建工程

cd vue3_test_vite

npm install                         # 安装依赖

npm run dev                         # 运行工程

方式二:

PowerShell
npm init vite@latest    # 创建工程



1.如果想要在vite创建的脚手架工程中使用TypeScript,则只需如下即可,

<template>

</template>



<script lang="ts">

const test:string = '这个是TypeScript语法'

</script>

2.如果想要在vite创建的脚手架工程中使用SCSS,则需要如下,

PowerShell
npm i -D sass
<template>

</template>

<script>

</script>

<style lang="scss">

</style>

3.vite的配置文件,在根目录下新建一个vite.config.js文件

JavaScript
export default{

    server: {

        // 代理

        proxy: {

            '/dali': {

                        target: 'http://jsonplaceholder.typicode.com',

                        changeOrigin: true,

                        rewrite: (path) => path.replace(/^\/daili/, '')
                      },
        }
    }
}

4.安装Vuex,参考Vue2的引入方式

PowerShell
npm install vuex

5.安装路由,参考Vue2的引入方式

PowerShell
npm i vue-router --save
posted @ 2023-03-27 09:59  中亿丰数字科技  阅读(68)  评论(0)    收藏  举报