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

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

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

报错码:

bash 复制代码
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

如图所示:

相关推荐
林晓lx1 天前
使用Git钩子+ husky + lint语法检查提高前端项目代码质量
前端·git·gitlab·源代码管理
王同学要变强1 天前
【深入学习Vue丨第二篇】构建动态Web应用的基础
前端·vue.js·学习
程序定小飞1 天前
基于springboot的web的音乐网站开发与设计
java·前端·数据库·vue.js·spring boot·后端·spring
Hello_WOAIAI1 天前
2.4 python装饰器在 Web 框架和测试中的实战应用
开发语言·前端·python
FinClip1 天前
凡泰极客亮相香港金融科技周,AI助力全球企业构建超级应用
前端
武昌库里写JAVA1 天前
element-ui 2.x 及 vxe-table 2.x 使用 css 定制主题
java·vue.js·spring boot·sql·学习
阿四1 天前
【Nextjs】为什么server action中在try/catch内写redirect操作会跳转失败?
前端·next.js
申阳1 天前
Day 6:04. 基于Nuxt开发博客项目-LOGO生成以及ICON图标引入
前端·后端·程序员
中国lanwp1 天前
npm中@your-company:registry 和 registry 的区别
前端·npm·node.js
Bacon1 天前
Electron 应用商店:开箱即用工具集成方案
前端·github