vue项目在开发环境下,让项目运行起来,是通过npm run dev命令,原理是在本地搭建了一个express服务器. 但是在服务器上就不是这样的,必须要通npm run build命令来对整个项目进行打包,打包后会在项目目录下生成一个dist文件夹,内容如下: 然后就是把这些文件丢到服务器上的某个文件夹下,我这里的文件夹名字是ibms 遇到的问题: 1. 直接去访问http://www.xxx.com/ibms/,会发现网页是白屏的,什么都没有,这就比较奇怪了,其实是因为资源加载的路径有问题!

最近一直在做项目,发布部署的事情都是同事或者老大做的,无奈什么事都要自己尝试经历后才能记住,所以发布的事情轮到我了,由于是第一次发布部署项目到一个新的服务器环境,难免会遇到各种各样的问题,总结下来,希望可以帮到需要的人. 项目框架使用的是vue+.netCore2.2所以发布的时候需要前后端分开发布,遇到的问题是挺多的,不过对自己来说也算是一种经历吧. 一．.netCore 项目发布 1.1 修改环境配置为线上服务器的数据库地址 将网站下的三个json文件的数据库配置修改为线上的数据库环境 1.

创建 vue 组件 1.创建vue项目,为了简洁方便,推荐使用webpack-simple构建一个项目 vue init webpack-simple your-project 2.在 src 目录下新建子目录lib,用来放后面自己写的所有组件 3.编写自己的组件 首先新建一个vue文件和一个index.js vue用于编写组件的模版和逻辑,像平时封装插件一样 ps:需要给组件命名 name: xxx,用于后面的导出 具体如下: index.js 作用是将该组件作为 Vue 插件,注册到 Vue

jenkins的安装 Jenkins是一款开源 CI&CD 软件,用于自动化各种任务,包括构建.测试和部署软件. Jenkins 支持各种运行方式,可通过系统包.Docker 或者通过一个独立的 Java 程序. 安装 这里的操作系统为WSL Ubuntu,其它系统的安装的请参考jenkins官方文档 wget -q -O - https://pkg.jenkins.io/debian/jenkins.io.key | sudo apt-key add - sudo sh -c 'echo de

初始化项目vue init webpack-simple XXX 定义组件略 发布配置1.package.json 2.webpack.config.js(注释部分为原配置) 发布1.登录 2.发布npm publish

摘要: 代码越短越好! 我们发布了fundebug-vue插件,可以简化Vue框架接入Fundebug的代码. Vue如何接入Fundebug 1. 安装fundebug-javascript与fundebug-vue npm install fundebug-javascript fundebug-vue 2. 配置 import * as fundebug from "fundebug-javascript"; import fundebugVue from "funde

总体分为2个步骤 一,先写好插件 二,发布到npm上面 一,写vue插件 vue有一个开放的方法install,在vue插件需要写在这个方法里面,在vue官网,里面说的很清楚,这个方法里面可以是全局方法,可以是指令还可以是挂载在原型的方法. 而vue在使用插件时候,需要首先use. 写好插件之后需要应用webpack打包.然后将代码统一推送到npm上面就可以了. 二,发布到npm上面 1)首选需要有个npm注册账号,这个可以直接在npm官方注册 2)在cmd上面切换路径到打包好的vue插件目录

由于工作需要,这里我先创建一个vue的工程. 1.首先安装好gitlab相关插件:GitLab.GitLab Hook.NodeJS 插件安装参考:https://www.cnblogs.com/jxd283465/p/11542680.html 2.jenkins服务器安装git 和 nodejs git安装: yum -y install git nodejs安装:这里我安装的在home路径下,可自行更改. wget https://nodejs.org/dist/v9.8.0/node-v

参考资料:vs code配置ftp连接远程服务器实现代码文自动上传 1.在vscode应用商店中搜索拓展sftp插件,然后进行安装.2.安装完成后重启窗口,按快捷键Ctrl+shift+p,输入sftp:config回车进入配置文件. 配置项: { "host": "xxxx.ftp.azurewebsites.windows.net", //ftp地址 "protocol": "ftp", //协议类型 "port

1.初始化项目 vue init webpack-simple XXXXX(此处为插件名) 使用vue创建一个简单的项目,删除src中除了main.js和app.vue外的文件,清空app.vue中无用内容 插件编写完成 可以本地app.vue先运行一下 是否效果正常 再调整 2.更改配置文件 在index.js内 import headerNavbar from './webappHeader' const headNavbar = { install(Vue, options) { Vue.

前言 在此之前,你需要去npm官网注册一个属于自己的账号,记住自己的账户名以及密码.邮箱,后面会用的到.第一步,安装webpack简易框架 vue init webpack-simple marquee 这里会用到vue init 命令,如果你的cli版本是3或者以上,那么在此之前你需要安装vue/cli-init npm install -g @vue/cli-init vue init 的运行效果将会跟 vue-cli@2.x 相同 第二步,封装Vue插件1.安装完成后,会出现以下目录即可成

1.确保程序是可运行的,即npm run dev可以运行 2.把index.js修改 3.运行npm命令npm run build 4.生成的dist文件为 直接点击index.html就能运行,部署到服务器上面也能运行,例如要部署到tomcat.就把整个dist文件复制到wabapps下面,访问该目录就能运行

npm run dev是开发环境, npm run build是生产环境, 在开发环境完成代码和测试, 之后用生产环境生成代码, npm run build的时候, 一开始就会提示Built files are meant to be served over an HTTP server. Opening index.html over file:// won't work., 因为vue-cli的默认配置中, publishPath是用绝对目录, 所以dist文件夹里的文件必须放在服务器的根目

项目地址:https://github.com/Rosen97/web-shop.git 博客地址:https://segmentfault.com/a/1190000017323841

前记:上一篇 https://www.cnblogs.com/adouwt/p/9211003.html, 说到了一个完整的vue插件开发.发布的流程,总结下来就讲了这么一个事,如何注入vue, 如果封装vue插件,如何测试vue插件,以及如何发布vue插件到npm.但是,这里开发测试到发布是分开在两个项目的,未免有些多余,今天的笔记讲的就是在上一篇的基础上,重新换了一下项目框架,讲开发测试,到打包发 布一个完整的项目,这个项目欢迎大家测试使用,一个基于vue上传文件的一个插件,能够显示上传的速

对于Vue.js来说,如果你想要快速开始,那么只需要在你的html中引入一个<script>标签,加上CDN的地址即可.但是,这并不算是一个完整的vue实际应用.在实际应用中,我们必须要一系列的工具,包括:模块化,转译,预处理,热加载,静态检测和自动化测试等.对于一个需要长期维护和大型的项目而言,这些工具是必不可少的,但是尝试配置初始化这些很痛苦.这就是我们发布vue官方提供的脚手架工具的原因,一个简单的构建工具,通过几个默认的步骤帮助你快速的构建Vue.js项目. 1.安装node环境 可以

vue.js 变化 从 github 的发布记录我们可以看到2017年 vue.js 的第一个发布为 v2.1.9,最后一个为 v2.5.13,主要发布小版本 2.2~2.5.这些发布提升了vue 与 TypeScript 的结合.改进了对服务端渲染(SSR)和 native 渲染的支持.提供了更好的测试.开发体验及其他的一些功能与优化. vue@2.2 变化 1)使用 v-for 必须要添加 key 属性. 2)单文件组件(SFC)标签需要闭合,尽管 html5 中标签没有闭合也是有效的. 3

一.script引入(联系使用,小型项目) 直接下载并用 <script> 标签引入,Vue 会被注册为一个全局变量. <script src="https://cdn.jsdelivr.net/npm/vue@2.5.16/dist/vue.js"></script> 二.Vue 提供一个官方命令行工具 vue-cli 是一个官方发布 vue.js 项目脚手架,使用 vue-cli 可以快速创建 vue 项目. 1.cli是建立在node的环境下,

译者按: 学习优秀的开源项目是提高代码水平最有效的方式. 原文: 30 Amazing Vue.js Open Source Projects for the Past Year (v.2018) 译者: Fundebug 为了保证可读性,本文采用意译而非直译.另外,本文版权归原作者所有,翻译仅用于学习. 在过去的一年中,我比较了近3000个Vue.js开源项目,选出30强(1%的比例). 这是一个有竞争力的清单,因为我仔细挑选2017年1月至12月期间发布的最佳开源Vue.js库,工具和项目.

测试环境:... 生产环境:发布--文件系统--Release--本地文件--成功copy服务器上:(第一次发布vue项目前后端copy顺序,避免一些bug)

译者按: 学习优秀的开源项目是提高代码水平最有效的方式. 原文: 30 Amazing Vue.js Open Source Projects for the Past Year (v.2018) 译者: Fundebug 为了保证可读性,本文采用意译而非直译.另外,本文版权归原作者所有,翻译仅用于学习. 在过去的一年中,我比较了近 3000 个 Vue.js 开源项目,选出 30 强(1%的比例). 这是一个有竞争力的清单,因为我仔细挑选 2017 年 1 月至 12 月期间发布的最佳开源 V