1.准备工作。 1.首先准备安装Vue及Vue-CLI $ npm install vue $ npm install -g @vue/cli2.其次下载Tomcat tomcat.apache.org/index.html 任选一个版本，我测试用的是macOS，所以下载了第二个压缩包? 下载到本地后，解压缩，并且将解压缩后的文件夹复制到以下路径下，其中电脑名称就是你的用户名称。 /Users/{电脑名称}/Library ，并且重命名为ApacheTomcat，这里要提一下，在这个文件夹下有个webapps，双击进去，会有很多文件，不...
一、nodejs配置 首先加入nodejs插件 –>–> 在配置里面配置这个插件 –>这样我们就能在自动构建发布的配置里看到nodejs的编译选项了 二、发布配置 首先新建一个自由风格的项目然后配置构建保留天数和参数化构建 这里选择在svn上的资源，配置好访问的用户信息 这样我们在构建的时候能看到项目的不同版本接下来选择构建的数据源位置echo $PATH node -v npm -v npm install chromedriver --chromedriver_cdnurl=http://cdn.npm....
Vue项目尤其是基于.vue单文件格式的项目部署，在build成js文件后发布到服务器上，一般都是通过nginx反向代理到跟文件目录后直接访问，然而由于很多时候没办法使用更多的子域名（比如微信公众号只能有一个域名），所以急需将服务器部署到子目录。本经验以一次成功的系统部署为例，讲解子目录方式部署Vue工程。 首先介绍一下Poi，我们的项目没有使用webPack进行前端工程项目管理，使用了Poi进行管理：Develop web apps with no build...
github pages 是 github 免费为用户提供的服务，写博客，或者部署一些纯静态项目。 最近将 vue cli 3.x 初始化项目部署到 github pages，踩了一些坑，记录如下。 https://github.com/nusr/resume-vue 1. vue-router 不要开启 history 模式 路径中的 # 比较丑，就开启了 vue-router 的 history 模式，去掉了 #。平时做项目也是默认开启 history 模式。折腾了半天发现，我这是部署到 github pages ，服务器没有配置，导致页面一直请求...
<IfModule mod_rewrite.c>RewriteEngine OnRewriteBase /RewriteRule ^index\.html$ - [L]RewriteCond %{REQUEST_FILENAME} !-fRewriteCond %{REQUEST_FILENAME} !-dRewriteRule . /index.html [L] </IfModule>nginx配置 location / {try_files $uri $uri/ /index.html; }vue history模式下nginx配置 服务端nginx的一开始配置如下（假设域名为：xx.xxx.com）： [***** ~]# cat /Data/app/nginx/conf/vhosts/xx.xxx.com.conf server...
前言 平时部署前端项目流程是：先部署到测试环境ok后再发布到生产环境上，部署到测试环境用 xshell 连上服务器，然后用 xftp 连接服务器，然后本地 build 项目，接着把 build 好的文件通过 xftp 上传到服务器上，整个流程感觉稍有繁琐，重复。 本教程讲解的是 Vue-CLI 3.x 脚手架搭建的vue项目, 利用scp2自动化部署到静态文件服务器 Nginx 一 安装scp2 scp2是一个基于ssh2增强实现，纯粹使用JavaScript编写。 而ssh2就是一个使用no...
最近部署一个Vue项目到阿里云ECS上，因为项目涉及一些跨域请求，所以采用了Nginx代理请求本地的node服务（利用pm2做进程管理）。node服务借助axios设置headers的referer、host转发请求，解决跨域请求问题。 先交代下在阿里云ECS里安装的部署环境：phpstudy（php调试运行大礼包，里面包含nginx、mysql等，还能监控端口占用情况）、pm2（node服务进程管理工具）、node、git等等。 部署过程 拉去GitHub项目代码至root目录下（找到安装...
本教程主要讲解的是 Vue-CLI 3.x 脚手架搭建的vue项目, 先构建生成dist文件(纯静态应用), 然后自动化部署到静态文件服务器 Nginx。 一、Nginx服务器文件的配置 server {listen 80;server_name www.xxxxxx.com;#生产环境location / {root /usr/local/www/xxx_program/;index index.html;try_files $uri $uri/ /index.html;}}server {listen 80;server_name test.xxxxxx.com; #测试环境location / {root /usr/local/www/xxx_program_...
1. 创建一个vue项目相信大部分人都已经知道怎么创建项目的，可以跳过这一节，看下一节。 1.1 安装@vue/cli # 全局安装 vue-cli脚手架 npm install -g @vue/cli等待安装完成后开始下一步 1.2 初始化项目 vue create vue-cli3-project(1)选择一个预设可以选择默认预设，默认预设包含了 babel , eslint 我们选择更多功能 Manually select features 回车后来到选择插件 (2)插件选择 这边选择了（Babel、Router、Vuex、Css预处理器、Lin...
五一之前就想写一篇关于Vuepress的文章,结果朋友结婚就不了了之了。 记得最后一定要看注意事项！ Vuepress介绍 官网：https://vuepress.vuejs.org/ 类似hexo一个极简的静态网站生成器,用来写技术文档不能在爽。当然搭建成博客也不成问题。 Vuepress特点 响应式,也可以自定义主题与hexo类似内置markdown(还增加了一些扩展),并且可以在其使用Vue组件Google Analytics 集成PWA 自动生成Service Worker快速上手 安装 初始化项目 yarn ...
项目： vue + express + mongodb项目前后分离部署在一台服务器上面 express端口：3000mongodb端口：27017vue端口：本地是8080 服务端是：80本地开发配置本地开发基于vue cli 端口是 8080如果请求api的时候在前缀加上localhost:3000会提示跨域问题，我们可以使用下面方式来解决这个问题 在vue项目路径找到这个文件 /vue-item/config/index.js 找到这行代码：proxyTable: {}添加如下配置demo: proxyTable: {/v1/**:{target: http://l...
写在前面Vue-Router 有两种模式，默认是 hash 模式，另外一种是 history 模式。 hash：也就是地址栏里的 # 符号。比如 http://www.example/#/hello，hash 的值为 #/hello。特点：hash 虽然出现 URL 中，但不会被包含在 HTTP 请求中，对后端不会产生什么影响，改变 URL 不会重载页面。history：利用了 HTML5 History Interface 中新增的 pushState() 和 replaceState() 方法，来完成 URL 跳转而无须重新加载页面。（需要特定浏览器支...
有小伙伴私信问我vue项目是如何进行前后端不分离打包发布的，那我岂能坐视不管，如此宠粉的我肯定是要给发一篇教程的，话不多说，开始操作 前端假如我们要发布我们的Vue项目，假设我们前端用的是history路由(要发就发个全套的)，并且在后端带有一个二级目录，以便于可以在服务器上部署N个项目，在这里后台服务器的话，我用Nginx服务器来给大家模拟，接下来就面对疾风吧： 一、在这里我前端vue项目使用vue cli脚手架进行搭建的，后台...
网上流行的解决方案是将assetsPublicPath: /改成./，下面说一下这个解决方案的弊端： 通常页面空白的问题出现大多数是由于Spring Boot端配置了server.servlet.context-path，上下文改变了css, js等文件的访问路径，文件无法加载导致index.html显示空白。/改成./是将绝对路径变为相对路径，可以动态适应Spring Boot端上下文的改变，这是为什么这个解决方案起作用的原因。 Vue项目部署在Spring Boot出现的另一个常见问题是当刷新浏览...
最近好多伙伴说，我用vue做的项目本地是可以的，但部署到服务器遇到好多问题：资源找不到，直接访问index.html页面空白，刷新当前路由404。。。用react做的项目也同样遇到类似问题。现在我们一起讨论下单页面如何部署到服务器？ 由于前端路由缘故，单页面应用应该放到nginx或者apache、tomcat等web代理服务器中，千万不要直接访问index.html，同时要根据自己服务器的项目路径更改react或vue的路由地址。 如果说项目是直接跟在域名后...