以自己的项目为例

第一步:手动修改config文件夹中的index.js文件中的build对象,将 assetsPublicPath 中的 “/” ,改为 “你实际的加载路径”

如图:

第二步:执行(c)npm run build

第三步:发现目录下多一个dist的文件夹,双击点击index.html,就可以在本地查看效果

如图:

ps:注意事项

  A.如果在config -> index.js 中的 build 代码中的 productionSourceMap的值设为false ,打包后文件体积可以减少百分之八十

 

相关链接:

  https://www.cnblogs.com/xueweijie/p/6971146.html

  https://www.cnblogs.com/hai-cheng/p/7826701.html

作者:smile.轉角

QQ:493177502

【vue】vue +element 搭建项目,vue-cli 如何打包上线的更多相关文章

  1. 搭建项目vue + vue-router + vuex + vue-i18n + element-ui + egg + sequelize

    vue + vue-router + vuex + vue-i18n + element-ui + egg + sequelize https://www.cnblogs.com/wuguanglin ...

  2. Vue + TypeScript + Element 搭建简洁时尚的博客网站及踩坑记

    前言 本文讲解如何在 Vue 项目中使用 TypeScript 来搭建并开发项目,并在此过程中踩过的坑 . TypeScript 具有类型系统,且是 JavaScript 的超集,TypeScript ...

  3. 使用VUE CLI3.0搭建项目vue2+scss+element简易版

    1.安装Vue CLI 3 //三选一即可cnpm install -g @vue/cli npm install -g @vue/cli yarn global add @vue/cli 注意: 1 ...

  4. 【vue】vue +element 搭建项目,将js函数变成vue的函数

    demo:时间转换 1.目录 <1>在src文件夹下新建文件夹prototypefns--------在此文件夹创建util.js, <2>在prototypefns下新建文件 ...

  5. 【vue】vue +element 搭建项目,组件之间通信

    父子组件通信 父 通过props属性给 子传递数据 子 操作 父  this.$parent.XXX 子通过$emit传递参数 或者通过vue-bus vue-bus既可以实现父子组件之间的通信,也可 ...

  6. 【vue】vue +element 搭建项目,vuex中的store使用

    概述: 每一个 Vuex 应用的核心就是 store(仓库).“store”基本上就是一个容器,它包含着你的应用中大部分的状态 (state).Vuex 和单纯的全局对象有以下两点不同: Vuex 的 ...

  7. vue.js + element 搭建后台管理系统 笔记(一)

    此文仅记录本人在搭建后台系统过程中遇到的难点及注意点,如果能帮到各位自然是极好的~~~ 项目主要架构:vueJS.elementUI.scss 一.项目初始化 首先需要安装nodejs,安装方法就不在 ...

  8. vue教程3-webpack搭建项目

    vue-cli https://cli.vuejs.org/zh/ vue-cli是vue的命令行工具,对于创建项目,安装各种组件,运行项目都极为方便,是在开发vue中的必备工具 vue-cli基于n ...

  9. VUE,基于vue-cli搭建创建vue项目

    前提:必须安装node.js,官方地址:https://nodejs.org/en/ 然后安装vue-cli 安装方式:cmd命令行安装:打开cmd命令符输入进行全局安装脚手架:npm install ...

随机推荐

  1. Java8 默认方法

    概述 Java8新增了接口的默认方法.使用default关键字. 默认方法就是接口可以有实现方法,而且不需要实现类来实现其方法.相对于JDK1.8之前的接口来说,新增了可以接口中实现方法. 可以说在接 ...

  2. 今天学习了flex布局

    前言:这个网站详细讲了水平.垂直.水平垂直的css方法.https://css-tricks.com/centering-css-complete-guide/ 布局的传统解决方案,基于盒状模型,依赖 ...

  3. EF中更新操作 ID自增但不是主键 ;根据ViewModel更新实体的部分属性

    //ID自增但不是主键的情况 public int Update_join<TEntity>(TEntity entity) where TEntity : class { dbconte ...

  4. .Net Mvc 异步编程

    关于在mvc/webapi 中 async/await 异步编程的探究和整理 你可以用双手玩转多个球 查看调试器windbg和sos.dll调试器扩展或挖掘W3SVC日志 设置minWorkerThr ...

  5. angularjs+webapi2 跨域Basic 认证授权(一)

    如今的app,利用各种前端框架结合html5的混合开发模式已然盛极一时.其中ionic+angularjs更是如日中天.这种模式利用angularjs $http 请求数据api 以达到前后端分离深得 ...

  6. ajaxJson(常用)

    function ajaxJson(method, url, data, callback) { var options = { type: method, url: url, dataType: ' ...

  7. Win7怎么录制电脑屏幕视频

    我们在看视频的时候,经常会看到自己特别喜爱的视频,想要把其中的某些片段给录制下来,那么Win7怎么录制电脑屏幕视频?其实步骤很简单,下面就来分享下具体的步骤. 使用工具: 电脑 操作方法: 第一步.首 ...

  8. Android IPC机制(三)使用AIDL实现跨进程方法调用

    上一篇文章中我们介绍了使用Messenger来进行进程间通信的方法,但是我们能发现Messenger是以串行的方式来处理客户端发来的信息,如果有大量的消息发到服务端,服务端仍然一个一个的处理再响应客户 ...

  9. 数组去重(JS)

    数据类型: (栈类型) 原始值:boolen,num,string,null,undefined (堆类型) 引用值:object,array 首先重新定义一个type()函数, <script ...

  10. Eclipse启动时发生An internal error occurred duri ng: "Initializing Java Tooling ----网上的坑爹的一个方法

    补充一下: 上面的方法不行. 我的个人解决方法 出现这种问题的原因,我的是eclipse换了,工作目录还是用之前的那个 把build Automatically的钩去掉 假设我们是用之前的worksp ...