vue项目npm run build 打包之后如何在本地访问

news2024/10/7 20:29:37

vue项目npm run build 打包之后如何在本地访问

如果直接访问时,则会报错如下的信息:
报错码:

Access to script at 'file:///D:/assets/index-DDVBfHVo.js' from origin 'null' has been blocked by CORS policy: Cross origin requests are only supported for protocol schemes: http, data, isolated-app, chrome-extension, chrome, https, chrome-untrusted.
index-DDVBfHVo.js:1 
        
        
       Failed to load resource: net::ERR_FAILED
index.html:1 Access to CSS stylesheet at 'file:///D:/assets/index-DCsNNTuD.css' from origin 'null' has been blocked by CORS policy: Cross origin requests are only supported for protocol schemes: http, data, isolated-app, chrome-extension, chrome, https, chrome-untrusted.
index-DCsNNTuD.css:1 
        
        
       Failed to load resource: net::ERR_FAILED
/D:/favicon.ico:1 
        
        
       Failed to load resource: net::ERR_FILE_NOT_FOUND

在这里插入图片描述
本地访问的解决方案:
打包后不能直接打开访问,需要启一个服务,通过服务来访问,具体操作过程如下:
1、安装serve(在cmd命令行输入)
npm i -g serve

2、打包项目
npm run build 生成dist文件夹

3、本地访问(在dist文件夹内)
serve dist
如图所示:
在这里插入图片描述

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

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

相关文章

[RocketMq:基于容器化]:快速部署安装

文章目录 一:相关镜像准备:RocketNameServer1.1:查看相关镜像和版本1.2:拉取镜像1.3:配置和运行RocketNameServer容器 二:相关镜像准备:RocketBroker2.1:创建配置目录和broker配置文…

《软件设计师教程:计算机网络浅了解计算机之间相互运运作的模式》

​ 个人主页:李仙桎 🔥 个人专栏: 《软件设计师》 ⛺️生活的理想,就是为了理想的生活! ​ ⛺️前言:各位铁汁们好啊!!!,今天开始继续学习中级软件设计师考试相关的内容&#xff0…

通用模型Medprompt如何在医学领域超越专家系统

在AI的发展历程中,一直存在着两种理念的较量:一种是追求普适性的通用AI模型,另一种是针对特定领域深度优化的专业AI系统。最近,微软的研究团队在这一辩论中投下了一枚重磅炸弹——他们开发的Medprompt策略,使得通用AI模…

156.25MHz的差分晶体振荡器SG3225VEN

数字经济正焕发出勃勃生机,云计算,大数据,5G和人工智能等新技术的发展给行业带来了新的机遇。无论是在数据中心内部还是在数据中心之间,提供低成本,高速的100/200/400G小型化解决方案都是光模块的发展需求。为了使DSP稳定工作,需要一个小型的封装晶体振荡器来提供参…

合合信息Embedding模型获得MTEB中文榜单第一

前言 最近几年,可以说大语言模型汇聚了所有的光彩,大语言模型的飞速发展更是吸引着社会各界的目光,这些模型的强大能力源自于Embedding技术的支撑,这种技术将语言转化为机器可理解的数值向量。随着大型语言模型的不断突破&#x…

产品经理一定得把ppt做的很高大上吗

严格来说你的这个PPT不能说是丑,只能说不好看,但并非你自己说的那种非常不好看。百分制的话我能给到60分左右,属于勉强及格的水准。PPT好看的标准很模糊也很客观,每个人的审美水平有高低,所以很难做到众人都挑不出毛病…

onlyoffice 的使用感受

自接触onlyoffice到使用,半年多了,因为Windows server2008要使用,属于非常古老的服务器了,所以费了好大力气才安装上去了。 如果是linux下使用docker则非常简单了,几个命令就把onlyoffice安装上去了。 对于当今的机器…

【工程记录】Python爬虫入门记录(Requests BeautifulSoup)

目录 写在前面1. 环境配置2. 获取网页数据3. 解析网页数据4. 提取所需数据4.1 简单提取4.2 多级索引提取 写在前面 仅作个人学习与记录用。主要整理使用Requests和BeautifulSoup库的简单爬虫方法。在进行数据爬取时,请确保遵守相关法律法规和网站的服务条款&#x…

c调用python , 有参无参

文章目录 1. c语言调用python 的步骤1.1 包含头文件1.2 初始化Python解释器1.3 添加当前路径到sys.path 中1.4 导入要调用的模块1.5 获取函数对象1.5.1 检查函数对象是否可被调用 1.6 构造参数1.7 调用函数并获取返回值1.8 返回值解析1.9 释放引用的所有python对象1.10 关闭pyt…

Android 在attrs.xml添加属性时出现 Found item Attr/****** more than one time

Android 在attrs.xml添加属性时出现 Found item Attr/****** more than one time 问题描述解决办法方式一方式二 小结 问题描述 在Android应用开发过程中,经常需要自定义控件,并且定义控件的属性,方便灵活的修改控件的显示样式,提…

【CLion】clion无法加载或找不到cmakekists文件

一、问题表象 最近工作中,在git pull远程仓库最新版本程序后,平时打开CLion自动加载的工程CMakeLists文件突然失效(显示找不到可编译的文件),无法debug程序。 二、原因分析 基于平时的编码经验和之前git pull也出现…

李沐64_注意力机制——自学笔记

注意力机制 1.卷积、全连接和池化层都只考虑不随意线索 2.注意力机制则显示的考虑随意线索 (1)随意线索倍称之为查询(query) (2)每个输入是一个值value,和不随意线索key的对 (3)通过注意力池…

Oracle集群ORA-03113:end-of-file on communication channel

一、问题场景描述 今天Oracle集群要更新各数据库的数据,折腾的启动不了了: --》数据量比较大,数据泵方式导出的dmp文件 准备导入集群 --》由于之前的生产数据库数据比较少,需要增大表空间。 --》于是在sqlplus命令窗口&#xff0c…

ChatGPT4.0知识问答、DALL-E生成AI图片、Code Copilot辅助编程,打开新世界的大门

目录 1、DALL-E 文字转图片 在线AI修改2、Write For Me3、Code Copilot 目前最强的AI编程大模型4、Diagrams: Show Me5、Instant Website [Multipage] 网站合成神器6、AskYourPDF Research Assistant 无限PDF7、Diagrams & Data: Research, Analyze, Visualize 精读Excel …

kuramoto模型 - 简要介绍

Kuramoto模型源远流长,这里不会对它做过于理论方面的讲解,只是面向动力学重构的工作中,可能要用到Kuramoto模型的相关介绍。 假设读者了解的常微分方程基本概念,图论知识,了解邻接矩阵, 通过本文&#xf…

归并排序详解

目录 归并排序的核心思想: 递归实现: 非递归实现: 时间复杂度: 空间复杂度: 应用场景: 本文全部以升序为例: 归并排序的核心思想: 先分解在合并: 1.归并的归&…

运算符重载(2)

1.赋值运算符重载 #include<iostream> using namespace std;class Person { friend void test01(); public:Person(int age){m_Age new int(age);}/*堆区的数据由程序员手动开辟并手动释放*/~Person(){if (m_Age ! NULL){delete m_Age;}}Person& operator(Person &a…

Python_AI库 Matplotlib的应用简例:绘制与保存折线图

本文默认读者已具备以下技能&#xff1a; 熟悉Python基础语法&#xff0c;以自行阅读python代码块熟悉Vscode或其它编辑工具的应用 在数据可视化领域&#xff0c;Matplotlib无疑是一个强大的工具。它允许我们创建各种静态、动态、交互式的可视化图形&#xff0c;帮助我们更好…

币圈资讯Cryptosquare论坛

在加密货币世界中&#xff0c;信息的及时获取对于投资者和交易者至关重要。今天&#xff0c;我将向大家介绍Cryptosquare这个综合性资讯论坛&#xff0c;它汇集了币圈新闻、空投信息、社会热点以及与Web3相关的工作信息。让我们一起解锁加密世界的种种可能性&#xff0c;探索Cr…

鹏哥C语言复习——字符函数与字符串函数

目录 一.字符函数 1.字符分类函数 2.字符转换函数 二.基础字符串函数 1.strlen函数 2.strcpy函数 3.strcat函数 4.strcmp函数 三.基础字符串函数优化 1.strncpy函数 2.strncat函数 3.strncmp函数 四.进阶字符串函数 1.strstr函数 2.strtok函数 3.strerror函数 一…