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 @   中亿丰数字科技  阅读(60)  评论(0编辑  收藏  举报
相关博文:
阅读排行:
· TypeScript + Deepseek 打造卜卦网站:技术与玄学的结合
· 阿里巴巴 QwQ-32B真的超越了 DeepSeek R-1吗?
· 【译】Visual Studio 中新的强大生产力特性
· 【设计模式】告别冗长if-else语句:使用策略模式优化代码结构
· AI与.NET技术实操系列(六):基于图像分类模型对图像进行分类
点击右上角即可分享
微信分享提示