vue3整合springboot打完整jar包

 更新时间:2023年09月11日 15:18:24   作者:华山令狐虫  
本文主要介绍了vue3整合springboot打完整jar包,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧

前端

  • .env.developmen
VITE_APP_BASE_URL='/api'
  • .env.production
VITE_APP_BASE_URL='/'

axios 配置

axios.defaults.baseURL = import.meta.env.VITE_APP_BASE_URL

package.json

  "scripts": {
    "dev": "vite --mode development",
    "build": "vite build --mode production"
  }

vite.config.js

 server: {
    port: 4000, //设置服务启动端口号,是一个可选项,不要设置为本机的端口号,可能会发生冲突
    open: true, //是否自动打开浏览器,可选项
    cors: true, //允许跨域。
    // 设置代理
    proxy: {
      '/api': {
        target: 'http://localhost:8053/', //这是你要跨域请求的地址前缀
        changeOrigin: true, //开启跨域
        rewrite: (path) => path.replace(/^\/api/, '')
      }
    }
  }

后端

pom.xml

            <plugin>
                <groupId>org.codehaus.mojo</groupId>
                <artifactId>exec-maven-plugin</artifactId>
                <version>1.6.0</version>
                <executions>
                    <execution>
                        <id>exec-pnpm-install</id>
                        <phase>validate</phase>
                        <goals>
                            <goal>exec</goal>
                        </goals>
                        <configuration>
                            <executable>pnpm</executable>
                            <arguments>
                                <argument>install</argument>
                            </arguments>
                            <workingDirectory>${basedir}/src/ui</workingDirectory>
                        </configuration>
                    </execution>
                    <execution>
                        <id>exec-pnpm-run-build</id>
                        <phase>validate</phase>
                        <goals>
                            <goal>exec</goal>
                        </goals>
                        <configuration>
                            <executable>pnpm</executable>
                            <arguments>
                                <argument>build</argument>
                            </arguments>
                            <workingDirectory>${basedir}/src/ui</workingDirectory>
                        </configuration>
                    </execution>
                </executions>
            </plugin>

到此这篇关于vue3整合springboot打完整jar包的文章就介绍到这了,更多相关vue3 springboot打jar包内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家! 

相关文章

  • Vue.js项目前端多语言方案的思路与实践

    Vue.js项目前端多语言方案的思路与实践

    前端的国际化是一个比较常见的需求,但网上关于这一方面的直接可用的方案却不多,这篇文章主要给大家介绍了关于Vue.js项目前端多语言方案的思路与实践,需要的朋友可以参考下
    2021-07-07
  • vue src动态加载请求获取图片的方法

    vue src动态加载请求获取图片的方法

    这篇文章主要为大家详细介绍了vue src动态加载请求获取图片的方法,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2018-10-10
  • vue项目记录锁定和解锁功能实现

    vue项目记录锁定和解锁功能实现

    这篇文章主要为大家详细介绍了vue项目记录锁定和解锁功能实现,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2022-03-03
  • 详解Vue的watch中的immediate与watch是什么意思

    详解Vue的watch中的immediate与watch是什么意思

    这篇文章主要介绍了详解Vue的watch中的immediate与watch是什么意思,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2019-12-12
  • vue开发之LogicFlow自定义业务节点

    vue开发之LogicFlow自定义业务节点

    这篇文章主要为大家介绍了vue开发之LogicFlow自定义业务节点,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2023-01-01
  • Vue nextTick获取更新后的DOM的实现

    Vue nextTick获取更新后的DOM的实现

    本文主要介绍了Vue nextTick获取更新后的DOM的实现,文中通过示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2022-01-01
  • Vue.js实现输入框清空功能的两种方式

    Vue.js实现输入框清空功能的两种方式

    Vue.js 是一个流行的前端框架,它提供了多种方法来实现数据的双向绑定和事件处理,在构建表单时,我们经常需要实现清空输入框的功能,本文将介绍两种在Vue中实现输入框清空功能的方法,感兴趣的小伙伴跟着小编一起来看看吧
    2024-12-12
  • vue中定义的data为什么是函数

    vue中定义的data为什么是函数

    这篇文章主要介绍了vue中定义的data为什么是函数,vue中已经帮我们控制台输出警告,并且不会让组件中的data合并到options中去,那么,很友好的处理了开发者的强行将data写成对象的可能性,需要的朋友可以参考下
    2022-09-09
  • 前端Vue.js实现json数据导出到doc

    前端Vue.js实现json数据导出到doc

    这篇文章主要介绍了前端Vue.js实现json数据导出到doc,文章围绕主题展开详细的内容介绍,具有一定的参考价值,需要的小伙伴可以参考一下
    2022-09-09
  • vue强制刷新组件的三种方法

    vue强制刷新组件的三种方法

    在Vue中,强制刷新组件通常涉及到以下几种方法,本文给大家列出了常见的三种vue强制刷新组件的方法,感兴趣的朋友跟随小编一起看看吧
    2024-04-04

最新评论