创建vue3项目遇到的部分问题及解决方式

在这里插入图片描述

export default defineConfig({server: {// https: true,// 启用https协议，默认是HTTP协议host: true, // 监听所有地址port: 1314,// 前端项目启动的端口号open: true,// 开启代理cors: false, // 为开发服务器配置 CORSproxy: {'^/api': {target: '',// 服务器地址changeOrigin: true,// 开启代理ws: true,  // 开启 websockets 代理rewrite: (path) => path.replace(/^\/api/, '')// 请求接口重写}}}
})

参考链接：https://blog.csdn.net/fmoment/article/details/132128836
问题1
在这里插入图片描述
解决方式：首先安装 npm install --save-dev @types/node在vite.config.ts里面增加
import path from 'path'

问题2：

在这里插入图片描述

解决
下载 npm i @vitejs/plugin-vue 在 vite.config.js加入 import vue from '@vitejs/plugin-vue'
和plugins: [vue()],

import type { UserConfig, ConfigEnv } from 'vite'import { defineConfig, loadEnv } from 'vite'import path from 'path'import vue from '@vitejs/plugin-vue'export default defineConfig(({ command, mode }: ConfigEnv): UserConfig => {// const root = process.cwd()// 加载环境变量// const env = loadEnv(mode, root, '')// const { VUE_APP_BASE_API, VUE_APP_BASE_URL } = envreturn {resolve: {alias: {// 配置全局相对路径'@': path.resolve(__dirname, 'src')}},css: {preprocessorOptions: {scss: {// 导入scss的全局默认配置additionalData: '@import "@/assets/scss/index.scss";'}}},plugins: [vue()],server: {// https: true,// 启用https协议，默认是HTTP协议host: true, // 监听所有地址port: 1314,// 前端项目启动的端口号open: true,// 开启代理cors: false, // 为开发服务器配置 CORSproxy: {'^/api': {target: '',// 服务器地址changeOrigin: true,// 开启代理ws: true,  // 开启 websockets 代理rewrite: (path) => path.replace(/^\/api/, '')// 请求接口重写}}}  }})

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.mzph.cn/news/810260.shtml

如若内容造成侵权/违法违规/事实不符，请联系多彩编程网进行投诉反馈email:809451989@qq.com，一经查实，立即删除！