程序员经验分享-hwhale

vue build 打包遇到bug解决记录

2023-11-02

vue-cli-service serve

通常vue是不能直接使用vue-cli-service命令在终端运行的，所以才会在package.json中配置了scripts：
在这里插入图片描述

仔细看每个scripts里面的环境开头都是vue-cli-service，其实只是换了一种方式运行vue-cli-service。
比如运行：npm run local，则相当于运行了命令：vue-cli-service serve --mode local --open --port 9040

vue-cli-service serve

  • 用法：vue-cli-service serve [options] [entry] 选项：
    • open 在服务器启动时打开浏览器
    • copy 在服务器启动时将 URL 复制到剪切版
    • mode 指定环境模式 (默认值：development)
    • host 指定 host (默认值：0.0.0.0)
    • port 指定 port (默认值：8080)
    • https 使用 https (默认值：false)
      vue-cli-service build
  • 用法：vue-cli-service build [options] [entry|pattern ]选项：
    • mode 指定环境模式 (默认值：production)
    • dest 指定输出目录 (默认值：dist)
    • modern 面向现代浏览器带自动回退地构建应用
    • target app | lib | wc | wc-async (默认值：app)
    • name 库或 Web Components 模式下的名字 (默认值：package.json 中的 “name” 字段或入口文件名)
    • no-clean 在构建项目之前不清除目标目录的内容
    • report 生成 report.html 以帮助分析包内容
    • report-json 生成 report.json 以帮助分析包内容
    • watch 监听文件变化
  • 其中详细请看官网：https://cli.vuejs.org/zh/guide/cli-service.html#vue-cli-service-serve

vue打包修改dist文件夹名字

  • 打包修改dist文件夹名字
  • 打包的命令是：
    vue-cli-service build --mode dev
    所以需要在package.json里面配置环境：
    build:dev: vue-cli-service build --mode dev,
    默认打包出来的文件夹是dist，如果需要修改则需要在后面配置—dest，如以下打包出来的文件在文件夹tingyuan目录下，直接运行npm run build:dev 即可打包：
    build:dev: vue-cli-service build --mode dev --dest tingyuan,

vue build require is not defined 和 exports is not defind 错误

  • 问题描述：使用的是基于webpack的，webpack会默认带有require，但是在使用require.context的时候，一运行就报: require is not defined。百度找了很多无用的方法；
  • 最后发现vue.config.js配置文件里面的transpileDependencies设置为false即可:
    h
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)

日常问题记录

vue

vuejs

Bug

ArcGIS

vue build 打包遇到bug解决记录 的相关文章

  • Laravel Vue SPA 与 MPA/SSR

    许多 laravel vue 教程使用 ajax 调用来获取数据 看来 SPA 与 Laravel 是完全隔离的 IE Laravel 只是一个数据 API vue 应用程序也可以简单地托管在第三方外部服务器 例如 AWS S3 上 这是推

  • 使用 Vercel 进行 Vue.js 历史记录模式的服务器配置？

    我设置了一个非常基本的 Vue js 应用程序 主要使用这些步骤 https auth0 com docs quickstart spa vuejs 01 login 当我将路由器添加到该项目时 它询问我是否要使用历史模式 我说是 现在我正

  • 将 Select2（多项选择）与 vue.js 结合使用

    我是 vue 新手 并遵循了他们的 自定义指令 http vuejs org examples select2 html http vuejs org examples select2 html 当仅选择一个项目时 此方法效果很好 但当您选

  • 如何使用vue.js获取点击时按钮的值

    我在页面上有几个按钮 它们连接到相同的方法webcamSendRequestButton

  • Vue 3 控制台中的 Proxy 是什么意思？

    我正在对数组进行洗牌 并在控制台中收到一条奇怪的消息 我的 JSON 文件如下所示 id 1 name Sushi image https images pexels com photos 1640777 pexels photo 1640

  • 使用 vue.js 显示 json 结果

    您好 我尝试使用 vue js 显示 json 文件结果 目标是结果将显示在值上 这是我的代码 data return fetchData function var self this self http get api casetotal

  • node.js、vue.js 和express.js 堆栈开发

    我正在尝试使用 Linux 上的 Visual Studio Code IDE 使用 vue js express js 和 node js 创建一个 Web 应用程序 根据网上的一些文档 我读到安装 vue js 后 可以创建一个vue

  • 模拟安装挂钩 Jest 测试装置

    我正在对组件进行一些单元测试 但是 在某些组件中 我有一些东西在运行mounted使我的测试失败的钩子 我设法模拟了我不需要的方法 但是 我想知道是否有一种解决方法可以模拟mounted钩住自己 components attendeesLi

  • Asyncdata 与 Fetch 之间的区别

    获取数据和异步数据之间的确切区别是什么 官方文档是这么说的 异步数据 您可能想要获取数据并在服务器端呈现它 Nuxt js 添加 asyncData 方法 让您可以在之前处理异步操作 设置元件数据 异步数据每次在加载组件之前调用 仅适用于

  • Laravel Echo 不监听推送事件

    尝试使用 laravel 和 vuejs 创建一种聊天应用程序 发送消息后 我会从 laravel 触发事件 该事件会使用正确的事件类反映在推送器调试控制台上 但根本不会调用来自 vuejs 的监听回调 created window Ech

  • 如何仅在某些页面上显示验证码图标（VUE reCAPTCHA-v3）？

    我使用这个包 https www npmjs com package vue recaptcha v3 https www npmjs com package vue recaptcha v3 我添加了我的 main js import V

  • Vuetify 自动完成类似项目未显示

    我的本地案例中有类似标题的自定义帖子API我尝试通过搜索查询显示帖子items array Data count 5 entries id 3 title Senior developer Python id 4 title Senior

  • 在 Vue.js 中隐藏 div onclick

    以下 jQuery 的 Vue js 等价物是什么 btn click function hideMe hide jQuery 开箱即用 而 Vue js 则不然 要初始化 Vue js 组件或应用程序 您必须将该组件及其数据绑定到模板内的

  • VueJS 中数据无法正确显示

    我的 VueJS 代码有一个小问题 在 输出 压缩的 GS1 数字链接 URI 部分中 When there is no result it should have nothing display like this I have remo

  • 错误：[vuex] 期望 string 作为类型，但发现未定义

    学习Vuex 我写了一个简单的登录页面示例项目 https github com vuejs vuex tree dev examples shopping cart和document https vuex vuejs org zh gui

  • 左侧导航菜单上部隐藏

    当滚动到页面最底部时 左侧导航菜单的顶部将被隐藏 The image before scrolling is shown below 滚动后的效果如下图 我不确定此问题的确切原因 因此我将不胜感激任何有关识别和解决该问题的建议或帮助 为了确

  • 不知道如何预览我生成的 Nuxt3 应用程序

    我刚刚在静态模式下创建了一个 Nuxt3 但我不想每次都将其推送到 Netlify 进行预览 这是我的nuxt config js 没有改变 import defineNuxtConfig from nuxt export default

  • 如何在不使用变换或顶部/左侧的情况下转换列表中项目的位置

    有一天我偶然发现一个例子 https codepen io itslit pen gvKrMY它使用 Vue js 但我的问题更多是关于 Vue 用于实现状态之间转换的 CSS 和 HTML 卡片暂时获得等级 shuffleMedium m

  • 如何在生产模式下为 Chrome 扩展启用 Vue 开发工具？

    我正在构建一个 chrome 扩展 并使用 vue cli webpack 配置 我希望能够在运行后使用 vue devtoolsnpm 运行构建命令 我尝试添加Vue config devtools true 在 main js 中 或者

  • 分页在服务器端好还是前端好？ [关闭]

    Closed 这个问题是基于意见的 help closed questions 目前不接受答案 我正在构建 Laravel Vue 应用程序 我想知道在后端使用分页还是在前端使用分页更好 我认为最好在每页发送尽可能少的数据的请求 但我想听听

随机推荐

  • Jetson Nano安装系统和SDK【第二部分】

    一 写在前面 第二部分承接第一部分 第二部分的主要内容是使用虚拟机 为Nano EMMC安装系统与SDK 本部分刷入的Jetpack为 v4 6 2 是截至文章发布日的最新系统 刷入的SDK信息如下 二 安装系统和SDK 03 Nano E

  • 设计模式-装饰模式

    文章目录 前言 装饰模式介绍 实例 使用场景 优缺点 前言 当需要动态地给对象添加额外的功能 而又不想改变其类结构时 装饰模式 Decorator Pattern 是一个非常有用的设计模式 它属于结构型设计模式 通过组合来增加对象的功能 而

  • django在model中添加字段报错

    在以下类中添加 description 字段后 class Colors models Model colors models CharField u 颜色 max length 10 description models CharFiel

  • 每日一题——判断是不是平衡二叉树

    题目 输入一棵节点数为 n 二叉树 判断该二叉树是否是平衡二叉树 在这里 我们只需要考虑其平衡性 不需要考虑其是不是排序二叉树 平衡二叉树 Balanced Binary Tree 具有以下性质 它是一棵空树或它的左右两个子树的高度差的绝对

  • Error [ERR_REQUIRE_ESM] And Design Pro初始化报错

    Error ERR REQUIRE ESM And Design Pro初始化报错 今天创建项目 用And Design Pro初始化的时候报错 不能创建项目 如下图 D Code front gt pro create myapp D P

  • 通过鼠标滚轮实现缩放效果

    using System Collections using System Collections Generic using UnityEngine public class Scroll MonoBehaviour void Updat

  • iOS开发之网络监听（一）Reachability

    demo下载 Reachability对系统的网络状况类SCNetworkReachability进行的封装 持有全局的网络状况句柄reachabilityRef 简化了SCNetworkReachability的Api以及网络状态 使开发

  • Linux内核配置之Kconfig

    一 概述 Kconfig是按照特定的格式来书写的文件 menuconfig程序可以识别这种格式 然后从中提取出有效信息组成menuconfig中的菜单项 在修改内核配置或驱动移植时 需要在Kconfig文档中修改或添加一些内容 经典 博文

  • 如何使用github搭建一个属于自己的网址

    如何使用github搭建一个属于自己的网址 个人博客 前言 优点 1 现在大部分的个人网页都是通过阿里等平台租用一个域名 使用github pages可以免费拥有一个属于自己的域名 2 github中的每一个repository 库 都可以

  • C++ OpenCV光平面标定-线激光提取

    对于线激光中心的提取 主要有以下几种方法可参考 图源来自于Charms 传统激光条纹中心提取方法可参考该博主 对于上述方法中 目前强烈推荐细化法 灰度重心 其次不追求速度的话选择steger算法 该算法鲁棒性较好 精度高 两种方法都可实现亚

  • 《Android物联网应用程序开发》课程的一课一得

    在 Android物联网应用程序开发 这门课程的学习过程中 我收获了丰富的知识和技能 对于物联网应用程序的开发有了更深入的理解和实践经验 经过一学期的学习 我认为这门课程在以下几个方面给予了我很大的帮助和提升 首先 课程内容设计合理 覆盖了

  • 从零开始系统化学Java，大厂面试题汇总

    1 Java基础 Java基础务必要有一个非常牢固的根基 尤其是对于JVM和并发编程的掌握情况 属于进阶内容 但也是Java最为重要的基础内容 不论是面试还是工作 基础不好 写不出高质量 漂亮的代码 面试估计刚开始就会被面试官给拍死 基础不

  • easyui-datagrid记录checkbox选择状态

    需求 1 分页 即发送开始元素的索引 startNumber 和每页显示多少信息 pageSize 到后台 后台使用类似limit的函数查出数据后以json格式返回 2 记录checkbox的选择状态 第一页选择了A 翻到第二页 回到第一页

  • nginx启动报 ssl parameter requires ngx_http_ssl_module

    nginx启动报 ssl parameter requires ngx http ssl module 1 问题现象 服务器nginx 引入ssl配置时 报错 emerg the ssl parameter requires ngx htt

  • 微信小程序保存图片到相册

    目录 微信小程序实现将图片保存到手机相册 方案一 微信小程序实现将图片保存到手机相册 方案二 微信小程序之点击复制文本到剪贴板 微信小程序 判断是IOS还是安卓 微信小程序分享图片给微信好友 微信小程序实现将图片保存到手机相册 方案一 首先

  • Sharding-JDBC分布式事务总结（二）之@ShardingTransactionType()注解切换失效问题

    ShardingTransactionType注解失效以及解决办法 1 背景 使用依赖

  • Python+OpenCV教程12：腐蚀与膨胀

    转自 https www jianshu com p 05ef50ac89ac 主站 http ex2tron wang 原文 Python OpenCV教程12 腐蚀与膨胀 学习常用形态学操作 腐蚀膨胀 开运算和闭运算 图片等可到源码处下

  • Android程序员必会！你的技术真的到天花板了吗？成功定级腾讯T3-2

    什么是中年危机 根据权威数据显示 国内IT程序员鼎盛时期是在25 27岁左右 30岁对于程序员而言完全是一个38线 接着就是转业转岗的事情 这一点在业界也算是一个共识了 大学毕业步入IT行业普遍年龄也是在22岁左右 然而22 30岁之间也就

  • 第七届蓝桥杯大赛个人赛省赛（软件类）真题 C语言B组 3

    B组2题和A组的是重复的 so 跳过 题目 凑算式 B DEF A 10 C GHI 如果显示有问题 可以参见 图1 jpg 这个算式中A I代表1 9的数字 不同的字母代表不同的数字 比如 6 8 3 952 714 就是一种解法 5 3

  • vue build 打包遇到bug解决记录

    文章目录 vue cli service serve vue打包修改dist文件夹名字 vue build require is not defined 和 exports is not defind 错误 vue cli service

热门标签