uniapp通过vite创建工程

要使用 Vite 创建 Uniapp 工程，您可以按照以下步骤进行操作：

1. 打开命令行，输入以下命令来创建一个 Vue3/Vite 工程：

npx degit dcloudio/uni-preset-vue#vite project

这将创建一个以 TypeScript 开发的 Uniapp 工程。

2. 如果您想创建一个以 JavaScript 开发的 Uniapp 工程，可以输入以下命令：

npx degit dcloudio/uni-preset-vue#vite my-vue3-project

这将创建一个以 TypeScript 开发的 Uniapp 工程。

请注意，这些命令需要您的计算机已经安装了 Node.js。如果您还没有安装 Node.js，请先进行安装。

通过以上步骤，您就可以通过 Vite 创建一个 Uniapp 工程了。希望对您有帮助！

相关问题

创建一个vue3+uniapp+vite的项目

1. 首先安装 Node.js，可以从其官网下载对应的版本。

2. 安装 Vue CLI 4.x 版本，打开终端输入以下命令：

npm install -g @vue/cli

3. 创建项目，打开终端输入以下命令：

vue create my-project

其中，my-project 为你的项目名称。

4. 选择项目配置，根据需要选择配置，可以使用默认配置也可以手动配置。

5. 安装 uniapp 和 vite，打开终端进入项目目录，输入以下命令：

npm install uniapp

npm install vite

6. 配置 vite，打开项目根目录下的 vite.config.js 文件，添加以下内容：

const { defineConfig } = require('vite')
const vue = require('@vitejs/plugin-vue')

module.exports = defineConfig({
  plugins: [vue()],
  resolve: {
    alias: {
      '@': path.resolve(__dirname, './src')
    }
  },
  server: {
    port: 8080,
    open: true
  }
})

其中，plugins 是插件配置，resolve 是别名配置，server 是启动服务器的配置。

7. 修改 package.json 文件，添加以下内容：

"scripts": {
  "serve": "vite",
  "build": "vite build"
}

其中，serve 是启动开发服务器的命令，build 是打包命令。

8. 运行项目，打开终端输入以下命令：

npm run serve

9. 在浏览器中访问 http://localhost:8080，查看项目是否正常运行。

至此，一个 vue3 uniapp vite 的项目就创建完成了。

webstorm开发uniapp+vite+ts

以下是在WebStorm中开发uniapp+vite+ts的步骤：

1.创建一个新的uniapp项目，选择vite作为构建工具。

2.在项目根目录下创建一个vite.config.ts文件，用于配置vite。

3.在vite.config.ts文件中添加以下内容：

import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'

export default defineConfig({
  plugins: [vue()],
  resolve: {
    alias: {
      '@': '/src'
    }
  },
  server: {
    proxy: {
      '/api': {
        target: 'http://localhost:3000',
        changeOrigin: true,
        rewrite: (path) => path.replace(/^\/api/, '')
      }
    }
  }
})

4.在tsconfig.json文件中添加以下内容：

{
  "compilerOptions": {
    "target": "esnext",
    "module": "esnext",
    "moduleResolution": "node",
    "esModuleInterop": true,
    "allowSyntheticDefaultImports": true,
    "strict": true,
    "jsx": "preserve",
    "sourceMap": true,
    "baseUrl": ".",
    "paths": {
      "@/*": ["src/*"]
    }
  },
  "include": ["src/**/*.ts", "src/**/*.d.ts", "src/**/*.tsx", "src/**/*.vue"],
  "exclude": ["node_modules"]
}

5.在APP.vue中添加以下内容：

<template>
  <router-view></router-view>
</template>

6.在main.ts中添加以下内容：

import { createApp } from 'vue'
import './style.css'
import App from './App.vue'
import store from './store/index'
import router from './router/index'

const APP = createApp(App)
APP.use(store)
APP.use(router)
APP.mount('#app')