vue2.0项目结构和打包发布

最新推荐文章于 2025-06-20 20:07:16 发布
最新推荐文章于 2025-06-20 20:07:16 发布
阅读量205 收藏
点赞数
CC 4.0 BY-SA版权
文章标签： javascript ViewUI
原文链接：https://juejin.im/post/5b9098e3e51d450e6057e931
本文介绍了如何在前端项目中配置部署路径。通过修改config/index.js文件中的assetsPublicPath选项，可以将部署路径从默认的根目录更改为所需的任意路径。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

先来一张项目结构图：

本地开发测试运行的命令是npm run dev

打包发布的命令是 npm run build生成的dist文件夹里的文件就是我们可以布置到服务上的文件

但是呢，这打包好的文件的文件地址都是/根目录的，如果我们需要更改这个默认的更目录路径，需要在config文件夹里的index.js里的

assetsPublicPath: '/',修改目录就行了，这里它默认的就是根目录。

转载于:https://juejin.im/post/5b9098e3e51d450e6057e931

vue3.0和vue2.0的区别详细讲解
aaa123aaasqw的博客
07-04 2096
vue经历从2.0到3.0更新之后,简⽽⾔之就是变得更轻更快,使⽤起来更加⽅便,下面这篇文章主要给大家介绍了关于vue3.0和vue2.0区别的相关资料,需要的朋友可以参考下Vue 3.0是一个用于构建用户界面的JavaScript框架。相比于Vue 2.x，Vue 3.0在性能、体积和开发体验上都有了很大的提升。
【vue2.0入门】认识vue工程
qbbmnnnnnn的博客
11-08 1342
在熟悉以上文件以及其作用后，接下来我们就开始尝试开展一些vue页面的开发工作了，其他没介绍的内容以及未来可能会新增的内容我们可以边学边补充。 此外我们还介绍了vuejs devtools浏览器插件的下载、安装和使用。方便我们在日后开发vue项目时可以更准确的获取项目运行时的各类信息，提高代码开发效率。
二、Vue2.0项目结构内容及配置解析
qq_23135259的博客
01-13 2983
vue结构目录解析及main.js详细内容解析
Vue3 项目打包
最新发布
likuoelie的博客
06-20 1283
Vue3 是一个流行的 JavaScript 框架，用于构建 Web 应用和用户界面。项目打包是将开发环境代码编译为生产环境的静态文件，适合部署到服务器。调研发现，Vue3 项目通常使用 Vite 作为构建工具，替代了传统的 Webpack。打包命令为vite build，生成dist目录。调研中，菜鸟教程、Vite 官方中文文档和 优快云 博客提供了丰富的中文资源，适合初学者和高级开发者。Vite 允许通过自定义打包选项，位于项目根目录。常见配置如下：配置项描述示例base。
vue2从0开始打包发布npm包，踩坑无数，完整版
qq_45624939的博客
06-06 4162
初始化的package.json中“name”参数就是要发布的npm包的名字，必须是唯一的，可以去npm官网搜一搜有没有重名的；三、假设两个.vue文件就是我们想要打包的组件，我们要先将他们暴露出去，在项目的根目录（src同级）或src/components文件夹中新建一个文件index.js。这时候，项目就成功启动起来了，打开链接 http://localhost:8080 ，就可以看到我们的项目了。按回车后，大概需要5分钟，甚至更久，才会新建成功，慢慢等待。至此成功，真是踩了无数的坑！
vue-项目打包
前端
12-18 3507
作为一个前端之前并没有打包过项目，因此想一下打包的效果，记录一下我的打包过程：作为一个开端 首先，项目打包前的目录结构 然后，运行命令行 npm run build 因为是第一次打包，不熟悉打包的过程，与文件的变更，首先看了一下文件的结构，发现没有compenent与views中文件的生成目录。是没有打包进去么？ 先看一下效果，看一下是否打包进入了。 当我运行的时候发现页面报错，是个空白页，从...
vue2.0项目详解
孙霸天的专栏
03-03 1843
vue2.0(vue-cli)项目详解 创建vue项目 电脑系统为windows11，这里我使用WebStorm来创建项目，需要电脑安装node环境，node的版本为14.17.5，如下图所示 这里我的项目还是vue.2.x版本 创建步骤 点击New Project创建项目 选择Vue,js项目 点击创建后，IDE会自动下载相关依赖，执行相关操作 依赖下载完成后，如下图所示，会自动构建索引，方便方法的智能提示 项目结构 项目结构如下所示，如果没有vue.config.js，那就手动创建这个文件
vue2.0项目
05-10
Vue2.0项目是基于Vue.js 2.0构建的应用程序，通常包括一系列组件化、路由管理、状态管理和优化策略。在这个项目中，开发者利用Vue2.0的强大功能来实现各种交互和动态效果。 Vue的核心特性包括： 1. **虚拟DOM**：...
vue2.0中文离线官网文档（手册，教程，api）
06-29
本文将深入探讨Vue.js 2.0的关键知识点，包括Vue CLI、项目结构、组件系统以及组件间的通信。 **Vue CLI** 是Vue.js官方提供的一个脚手架工具，它简化了Vue应用的初始化过程。通过Vue CLI，开发者可以从预定义的...
vue2.0_project:vue2.0项目实战原始码（购物车和地址选配）
03-24
2. **项目结构** - **vue2.0_project-master**：这通常是项目的主要目录，包含所有源代码、配置文件和资源。 - **src**：源代码目录，通常包含`components`（组件）、`assets`（静态资源）、`router`（路由）、`...
总结Vue 第四天~Vue CLI----（Vue2.0 新手入门 — 从环境搭建到发布）
伟庭的博客
12-25 749
总结Vue 第四天~Vue CLI----（Vue2.0 新手入门 — 从环境搭建到发布）
vue2.0项目组成
田兴的博客
12-12 473
VUE2.0项目组成和打包发布 vue项目结构图： 本地开发测试运行的命令是npm run dev 打包发布的命令是 npm run build生成的dist文件夹里的文件就是我们可以布置到服务上的文件 但是呢，这打包好的文件的文件地址都是/根目录的，如果我们需要更改这个默认的更目录路径，需要在config文件夹里的index.js里的 assetsPublicPath: ‘/’,修改目录就...
Vue 打包和部署
Flying_Fish_roe的博客
01-06 3993
打包和部署是 Vue 应用上线的关键步骤，通过 Vue CLI 可以快速完成生产环境的打包。Vue 提供了灵活的配置选项，使得项目可以适配各种部署场景。在部署时，根据项目需求选择合适的托管方式，例如 Nginx、Netlify 或 Docker。通过合理的配置和优化，可以确保应用的高性能和可靠性。
Vue 2.0 最全面学习总结，适合新手快速入门
聪哥965
01-26 817
1 Vue.js 安装 2 Vue.js 目录结构 结构如图所示： 3 Vue.js 模板语法 4 生命周期 实例： 5 Vue.js 条件语句 6 Vue.js 循环语句 7 Vue.js 计算属性 8 Vue.js 样式绑定 9 Vue.js 事件处理器 10 Vue.js 表单 11 Vue.js 组件 12 Vue.js 自定义组件 13 Vue.js 路由 ...
Vue2.0 新手完全填坑攻略—从环境搭建到发布——Jinkey 原创
weixin_33726313的博客
10-10 695
本文作者 Jinkey（微信公众号 jinkey-love，官网 https://jinkey.ai）文章允许非篡改署名转载，删除或修改本段版权信息转载的，视为侵犯知识产权，我们保留追求您法律责任的权利，特此声明！感谢 showonne、yubang 技术指导Demo 地址:http://demo.jinkey.io/vue2源码:ht...
SpringBoot2+vue 实现头像上传 + 支持jar包部署
u014212540的博客
12-23 423
最近在做springboot +vue 前后端分离项目，之前一直是打war包部署到tomcat ，最近想打jar包部署，毕竟springboot 的优势是可以打jar包部署（因为jar包里内置了tomcat ，为以后的微服务及分布式部署打下基础），但是打jar 包部署会涉及到读取文件，之前用项目路径的方式就不起作用了，都要改为流的方式读取，之前我有一篇文章专门介绍了在jar里读取流的三种方式（classLoader、Thread、classpathResource）。今天我主要介绍头像上传，废话不多说，直接
vue+springboot前后端分离项目整合部署流程
haohulala的博客
05-30 5577
我们在进行前后端分离开发的时候，一般是将前端项目部署到nginx服务器上，与后端项目分开部署，但是如果是个人开发的小型项目，不需要这么麻烦，直接将前后端项目放到一起部署即可。本文就来介绍一下前后端项目一起部署的流程。
SpringBoot+Vue项目部署（传统方式）
weixin_44924882的博客
04-09 6465
虽然项目打包后用jar包里的配置文件也可以启动，但是推荐将配置文件提取出来，一般开发环境和生产环境的配置是不一样的，通过加载外部配置文件的方式启动，更便于维护配置信息，这里生成一个web-server.yml的配置文件，里面是项目的配置信息，可以根据项目实际需要生成。为了方便，有时候我们会连接本地的MySQL数据库，数据库安装成功后默认远程连接是关闭的，3306端口也是不对外开发的，需要做如下配置。项目在本地可以正常启动，这是因为本地有安装JDK，数据库等，若想要项目在服务器上也能正常启动，则同样需要。
Vue 2.0 项目开发实践入门指南
本节总结了 Vue 2.0 开发实践的入门知识，包括 Vue 2.0 项目结构、Webpack 基本知识点、Vue-cli 安装和使用、项目预览和项目配置。这些知识点将帮助读者快速了解 Vue 2.0 的基本概念和使用方法，为后续的学习和实践...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值