Vue3.0 前端工程创建指南：搭建项目并配置代理

创建 Vue3.0 前端工程并配置代理

1. 安装 Vue CLI

首先，我们需要安装 Vue CLI 4.x 版本，以便能够创建 Vue3.0 项目。

安装命令如下：

npm install -g @vue/cli

2. 创建 Vue3.0 项目

安装完成后，我们可以使用以下命令来创建一个新的 Vue3.0 项目：

vue create my-project

在创建过程中，我们需要选择使用 Vue3.0 版本，可以在如下界面中进行选择：

Please pick a preset: default (babel, eslint) Manually select features > Vue 3.x (Preview) # 选择 Vue3.0 版本

3. 配置代理文件

创建完成后，我们需要配置代理文件，以便解决跨域问题。

在项目根目录下创建一个 vue.config.js 文件，并添加如下内容：javascriptmodule.exports = { devServer: { proxy: { '/api': { target: 'http://localhost:3000', // 代理的后端地址 changeOrigin: true, // 是否跨域 pathRewrite: { '^/api': '' // 去掉/api前缀 } } } }};

以上代码意味着，我们将请求 /api 开头的地址都代理到了 http://localhost:3000 这个后端地址，同时去掉了 /api 前缀。

4. 总结

这样，我们就完成了 Vue3.0 项目的创建和代理文件的配置。