如何把vue.js项目部署到服务器上

如何把vue.js项目部署到服务器上面,我用的是tomcat服务器

1-改一下config/index.js文件,如下图,把assetsPublicPath: ‘./‘,

productionSourceMap: false

2-运行npm run build

然后在项目路径中找到打包后的文件,在项目文件的dist文件夹下面的static和index.html就是打包后的文件。然后我自己创建了cccBlog文件夹,把static和index.html拷贝到cccBlog下面,然后向服务器上传这个cccBlog文件夹就可以了。

3-上传cccBlog文件夹到服务器,我的是tomcat服务器

4-然后访问tomcat下面的cccBlog下面的index.html就可以了。

5-需要注意的是:图片资源命名的时候不要有中文,因为中文的话服务器访问可能图片显示不出来。

原文地址:https://www.cnblogs.com/ccplus/p/8993658.html

时间: 2024-10-10 11:35:59

如何把vue.js项目部署到服务器上的相关文章

DJANGO项目部署到服务器上

---- 说明: 本文章来自于 http://www.pythonav.com/wupeiqi/3.html  是武沛齐老师个人博客上取的内容. 尊重老师的成果. 小白的项目部署 项目开发完毕后,需要将代码放到服务器上,这样用户才能访问.接下来我们一步一步来进行一波部署操作. 1. 简单粗暴 项目开发完毕,在部署之前需要再配置文件中将 ALLOWED_HOSTS配置设置为:当前服务器IP或*,如: ALLOWED_HOSTS = ["*",] 示例源码:猛击下载 然后将源码上传至服务器

如何将Java Web项目部署到服务器上

项目部署 我们对于 Java Web 项目在本地机器(无论是 Windows 还是 Linux)上的部署已经了然于心了,那么对于在云服务器上部署 Java Web 项目又是如何操作的呢? 其实很简单,还是离不开 Web 项目部署的那三点:① 基础的 JDK 环境② 一个 Web 服务器.如 Tomcat.JBoss③ 一款数据库.如:mysql 对于云服务器上 Java Web 项目的部署,和平时在 Windows.Linux 下部署是一样的.最多也就是只能使用纯命令模式来操作而已,其实过程都一

SpringBoot项目部署到服务器上,tomcat不启动该项目

今天lz把项目重新传到服务器上后,重启tomcat遇到个问题,就是这个tomcat怎么都不启动这个项目,别的项目都没事,一番查找后发现问题所在. 我们先建个SpringBoot工程,重现一下问题: 写了一个简单的controller便于访问测试 可以看到是可以访问到的,接下下我们删除 ServletInitializer 类. 现在的项目结构变成这样: 重新运行一下工程,然后可以看到还是可以访问到的. 然后我们将删掉ServletInitializer 类的项目上传到服务器,看下tomcat启动

Vue.js项目在apache服务器部署后,刷新404的问题

原因是vue-router 使用了路由的 history 模式,这种模式充分利用 history.pushState API 来完成 URL 跳转而无须重新加载页面. const router = new VueRouter({ mode: 'history', routes: [...] }) 需要在服务端增加一个覆盖所有情况的候选资源:如果 URL 匹配不到任何静态资源,则应该返回同一个 index.html 页面,这个页面就是你 app 依赖的页面. 解决方案 在项目目录下新建文件.hta

Vue.js项目实战-打造线上商城

首先上一下完成后的效果: 首页: 商品详情页: 购物车页(其实还有个订单页,只是和购物车页基本类似,所以就不截图啦): 开始项目: 由于涉及的是前后端分离,所以我们的后台数据就模拟存储于浏览器端(config/config.js里面): 当然在这之前你需要使用Vue CLI构建项目(),然后才可以进行下去,还有我们这各项目里面用了Font Awesome图标库 来使我们的项目的图标更加酷炫.读者可以使用cnpm install font-awesome --save-dev安装,具体的Font

vue.js项目构建基础

这里构建的vue.js项目依赖node服务器运行. 项目搭建完整步骤: 安装node.js ,转至nodeJs网站http://nodejs.cn/ 下载nodeJs进行安装. 安装完毕检查nodeJs安装是否成功? nodeJs安装完成,自带npm,可以检查npm是否已经安装 安装webpack. webpack是一个模块加载器兼打包工具,在vue项目中,为了更好的管理代码使用模块系统,使用webpack打包. 安装webpack  查看webpack是否安装成功? 安装 vue-cli 脚手

Vue.js项目的开发环境搭建与运行

写作背景:手上入一个用Vue框架写的微信公众号项目,根据公司安排,我负责项目源代码的验收工作(当然专业的工作检测会交给web开发人员,我只是想运行起来看一看). 1 开发环境安装步骤: (一)安装node.js(JavaScript运行环境runtime) 从node.js官网下载并安装node,安装过程很简单,一路“下一步”就可以完成. 完成之后,开发命令行工具,输入 node -v 如果出现相应的版本号,则说明安装成功. 另外,npm是node.js下的包管理器,npm能很好的和诸如webp

如何把已完成的项目部署到服务器

今天,第一次为工作写日子,以后肯定会一直记录,好了,说一下重点吧.             如何把已完成的项目部署到服务器,            准备工作,在服务器上搭建 jdk 和 tomcat ,版本根据个人需求,我是 jdk1.7 和 tomcat 7.0 ,具体怎么搭建上网查吧.            第一步:把自己的项目上传到服务器上.我用的是最笨的方法,因为服务器的电脑,读取不到本地的U盘或硬盘.注意:项目的 “本身” 和 在本地的tomcat中的项目都要.因为要直接放在tomca

vue.js项目构建之vue-router2.0的使用

vue-router2.0官方文档地址:http://router.vuejs.org/zh-cn/index.html 单页应用? 单页应用程序(SPA,single page web application). SPA其实就是整个网站只有一个页面,只改变页面的显示内容,不需要改变整个网页. vue.js 的单页面应用是基于路由和组件的.路由用于设定访问路径,并将路径和组件映射起来.页面内容切换这里就是组件的切换. vue-router是vue.js官方的路由插件,适合构建单页面应用. vue