以自己的项目为例

第一步：手动修改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. canvas-8searchLight3.html

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  2. [CSS] Transitions动画效果(1)

    Transitions动画效果(1) 源码 https://github.com/YouXianMing/CSS-Animations/tree/master/Transitions 效果 细节

  3. ICML 2018 | 从强化学习到生成模型：40篇值得一读的论文

    https://blog.csdn.net/y80gDg1/article/details/81463731 感谢阅读腾讯AI Lab微信号第34篇文章.当地时间 7 月 10-15 日,第 35 届 ...

  4. Android和H5进行数据交互，Android获取H5Input框中的内容

    项目中嵌入了H5 页面,这个时候就需要拿到H5 input中的内容进行数据传递,先看实现的效果图

  5. eclipse安装其他颜色主题包

    eclipse安装其他颜色主题包: 用Help-Install new software安装的时候,work with的URL是 http://eclipse-color-theme.github.c ...

  6. AndroBench手机性能测试

    AndroBench是一个基准测试应用程序,可以衡量你的Android设备的存储性能. AndroBench提供两种方式,第一种可以快速与其他设备的存储进行比较. 第二种 SQLite可以查询数据库表 ...

  7. git 入门教程之1分钟快速了解 git

    git 入门教程 git 是分布式版本控制系统,是文本文档管理的利器,是帮助你管理文件动态的好帮手. 如果你曾经手动管理过文档,一定有这样的经历,比如你正在编辑文档,想删除某段落,又担心不久后可能会恢 ...

  8. codeforces 735D Taxes(数论)

    Maximal GCD 题目链接:http://codeforces.com/problemset/problem/735/D ——每天在线,欢迎留言谈论. 题目大意: 给你一个n(2≤n≤2e9) ...

  9. jsp笔记----97DatePicker日期插件简单使用

    <s:form action="" theme="simple"> <s:hidden name="keyword3" v ...

  10. AngularJS学习之旅—AngularJS 简介(一)

    一.AngularJS 简介 1.AngularJS 是一个 JavaScript 框架. AngularJS 是一个 JavaScript 框架.它是一个以 JavaScript 编写的库.Angu ...