vue build 打包遇到bug解决记录

文章目录

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

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 definedexports is not defind 错误

  • 问题描述:使用的是基于webpack的,webpack会默认带有require,但是在使用require.context的时候,一运行就报: require is not defined。百度找了很多无用的方法;
  • 最后发现vue.config.js配置文件里面的transpileDependencies设置为false即可:
    h

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/10044.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

JDBC的的使用

首先导入jar包。 https://downloads.mysql.com/archives/c-j/ package com.test.sql;import java.sql.*;public class StudySql {public static void init() throws SQLException {Statement stmt null;Connection conn null;ResultSet res null;PreparedStatement pstm…

自动化运维工具—Ansible概述

Ansible是什么? Ansible是一个基于Python开发的配置管理和应用部署工具,现在也在自动化管理领域大放异彩。它融合了众多老牌运维工具的优点,Pubbet和Saltstack能实现的功能,Ansible基本上都可以实现。 Ansible能批量配置、部署、…

CTFshow web入门 爆破

web21 bp 攻击模块的迭代器 输入账号密码 抓包 发现下面存在一个base64编码 我输入的是 123 123 发现就是base加密 账号 密码 那我们怎么通过intruder模块 自动变为 base64呢 然后去payload------>custom iterator(自定义迭代器) 位置1导入admin 因为是 账号:密码 这…

微服务远程调用openFeign简单回顾(内附源码示例)

目录 一. OpenFeign简介 二. OpenFeign原理 演示使用 provider模块 消费者模块 配置全局feign日志 示例源代码: 一. OpenFeign简介 OpenFeign是SpringCloud服务调用中间件,可以帮助代理服务API接口。并且可以解析SpringMVC的RequestMapping注解下的接口&#x…

win 安装虚拟机 再安装macos

0 视频教程 windows虚拟机一键安装苹果系统macos,轻松拥有xcode环境_哔哩哔哩_bilibili在windows环境下vmware虚拟机一键安装macos Catalina10.15.7苹果系统,帮助学习ios编程的朋友们实现xcode环境。文字教程:https://www.dhzy.fun/archives…

Prometheus 的应用服务发现及黑河部署等

目录 promtool检查语法 部署Prometheus Server 检查语法是否规范 部署node-exporter 部署Consul 直接请求API进行服务注册 使用register命令注册服务(建议使用) 单个和多个注册,多个后面多加了s 在Prometheus上做consul的服务发现 部署…

IL汇编字符串连接

在此实现了一个基本的IL汇编程序; 了解MSIL汇编和IL汇编评估堆栈_bcbobo21cn的博客-CSDN博客 它用了下面两句来在屏幕输出字符串, ldstr "I am from the IL Assembly Language..." call void [mscorlib]System.Console::WriteLine (string) …

用i18next使你的应用国际化-React

ref: https://www.i18next.com/ i18next是一个用JavaScript编写的国际化框架。 i18next为您提供了一个完整的解决方案,本地化您的产品从web端到移动端和桌面端。 在react项目中安i18next依赖: i18nextreact-i18nexti18next-browser-languagedetector&…

Spring(二):更简单的存储与读取 Bean

通过上一章的Spring,我们基本实现了Spring 的读取与存储,但是在操作过程中,读取与存储并没有那么得“简单” 一套流程还是很复杂,所以,本章来介绍更加简单得读取与存储。 在 Spring 中想要更简单的存储和读取对象的核…

mysql通过binlog恢复数据

开启binlog 在my.ini中添加以下两行代码: log-binmysql-binserver-id1 注意要写在[mysqld]范围内才会生效 查看binlog存放日志文件目录 show variables like %datadir%; 查看binlog文件名 show master logs; 将binlog转换成sql mysqlbinlog --no-defaults --bas…

【LeetCode热题100】打卡第42天:滑动窗口最大值搜索二维矩阵II

文章目录 【LeetCode热题100】打卡第42天:滑动窗口最大值&搜索二维矩阵II⛅前言 滑动窗口最大值🔒题目🔑题解 搜索二维矩阵II🔒题目🔑题解 【LeetCode热题100】打卡第42天:滑动窗口最大值&搜索二维…

SpringMVC程序开发

1.什么是Spring MVC? Spring Web MVC是基于Servlet API构建的原始的Web框架,从一开始是就包含在Spring框架中。它的正式名称“Spring Web MVC"来自其源模板的名称(Spring-webmvc),但通常被称为“Spring MVC" 从上述的定义我们可…

[visionOS][Apple Vision Pro] 缩放3D模型

方法一:通过代码来设置Model3D Model3D(named:"你的3D模型名称",bundle:realityKitContentBundle).padding(.bottom,50).scaleEffect(0.2) //这句用来缩放 方式二:别人可以,我验证过不行的方法 RealityKitContent工具中&#xf…

PLC-Recorder的高速采集有多快?0.5ms算快吗?看控制器能力了!

大家知道,PLC-Recorder有一个高速采集的功能,基于TCP连接或UDP报文,速度取决于发送端的能力。对于西门子PLC,能做到1-2ms的采集速度,但是,我在前面的文章里提到了0.5ms的高速采集,哪个控制器能这…

Linux 下 nc 发送接收 udp、tcp数据

nc,全名叫 netcat,它可以用来完成很多的网络功能,譬如端口扫描、建立TCP/UDP连接,数据传输、网络调试等等,因此,它也常被称为网络工具的 瑞士军刀 。 一、只服务端使用nc 备注:这种方式只能发…

Django实现音乐网站 ⑴

使用Python Django框架制作一个音乐网站。 目录 网站功能模块 安装django 创建项目 创建应用 注册应用 配置数据库 设置数据库配置 设置pymysql库引用 创建数据库 创建数据表 生成表迁移文件 执行表迁移 后台管理 创建管理员账户 启动服务器 登录网站 配置时区…

自媒体必备的8个素材网站,视频、音效、图片全部免费下载

自媒体必备的视频、音效、图片素材,这8个网站帮你解决。赶紧马住! 菜鸟图库 https://www.sucai999.com/video.html?vNTYwNDUx 菜鸟图库虽然是一个设计网站,但它还有非常丰富的视频和音频素材,视频素材全部都是高清无水印&#…

Java 贪心算法经典问题解决

文章目录 分金条题目思路代码实现测试用例以及结果输出 花费资金做项目最大收益题目思路代码实现测试用例以及结果输出 预定会议室题目思路代码实现测试用例以及结果输出 取中位数题目思路代码实现测试用例以及结果输出 最低字典序题目思路代码实现测试用例以及结果输出 结语 分…

vite打包性能优化以及填坑

目录 前言 项目优化前 分析 优化 拆分包 去除debugger CDN 加速 按需导入 文件压缩 图片压缩 viteImagemin报错 填坑 坑1 坑2 总结 配置 前言 最近在使用 Vite4.0 构建一个中型前端项目的过程中,遇到了一些坑,也做了一些项目在构建生产环…

C进阶:文件操作

C语言文件操作 什么是文件 磁盘上的数据是文件。 但是在程序设计中,我们一般谈的文件有两种:程序文件(例如.c,.h这一类编译,链接过程中的文件),数据文件。 程序文件 包括源程序文件(后缀为.c&…