npm run bui打包文件 dist里的index页面报 because its MIME type(‘text/html‘) is not a supported stylesheet

最新推荐文章于 2022-08-26 16:17:49 发布
最新推荐文章于 2022-08-26 16:17:49 发布
阅读量447 收藏 1
点赞数
分类专栏： webpack 文章标签： Webpack CSS 样式丢失 publicPath 打包问题
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/ProgressGo/article/details/119648646
版权

花了我两天的时间，终于给解决了！

正常的基于webpack创建项目，自然而然地的npm run build打包，然后打开dist文件下的index文件，给我报这样的错！

 和之前的操作一样，但是出现这样的问题，我很懵逼！后来找了各种资料发现我写的没问题，但是在一个配置是出现了默认根目录的问题，需要更改一下！

问题其实就是css样式获取不到，在build>webpack.prod.conf.js>output里添加

publicPath: './'

 

ProgressGo
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
vue项目 npm run build 打包静态项目问题，一步到位的操作
Jacy_Lee_LDF的博客
08-14 2267
这次是第一次做vue项目，什么都不懂，过程中也遇到很多问题，每一次解决了就习惯性的写篇文章记录下来，以免下次再遇到，这次项目终于写完了，要打包上线，发现直接npm run build 打包之后，index.html 页面打开空白，检查发现引用的文件都报错了，百度方法，不报错了，但是index依然空白，还有项目打包时报错的问题，经过几十个标签页的学习，我觉得干脆改打包之前该修改的内容已经该添加的内容都操作一遍好了，省心！以下是具体操作： 1.首先修改 config/index.js ： productio.
解决Vue-cli npm run build生产环境打包,本地不能打开的问题
10-17
在npm run build执行后，会生成一个dist目录，这个目录包含了打包后的index.html文件和static文件夹。但是，Vue-cli的默认配置可能会导致在本地直接打开index.html时遇到问题。这是因为Vue-cli默认的配置是将静态...
图片打包进服务器变成html访问报错,解决Vue项目打包后打开index.html页面显示空白以及图片路径错误的问题...
weixin_34245159的博客
06-04 697
Vue项目运行npm run build后会生成一个dist文件夹，我们一般都是把这个文件夹部署到服务器上。dist文件夹里边有一个static文件和一个index.html页面，这个index就是最后单页面的最终文件。问题一：我在打包完成后，打开index.html文件发现地址并没有携带路由。 这样的话页面就是空白了，因为没有组件被添加到页面中。打开F12会看到一堆的红色failed请求。打开请...
vue 项目打包 报错
Sunshine_Jian的博客
10-26 5753
再执行 npm run build 之后，会生成一个dist文件夹，打开index.html，控制台报错 如下图所示： 这里是因为找不到正确的路径，导致报错。 解决办法： 1、在根目录下，新建vue.config.js文件，当然有的话，就忽略此条； 2、在vue.config.js里 将publicPath: "/" 改为publicPath: "./" ，之后重新打包，npm run build 即可。 publicPath: "/" =====>&gt...
vue笔记（一）
qq_44733345的博客
10-13 157
1.vue3安装 由于npm安装速度慢，所以是用淘宝镜像及其命令cnpm，使用淘宝定制的cnpm命令工具代替默认的npm $ npm install -g cnpm --registry=https://registry.npm.taobao.org 使用cnpm命令安装模块 $ cnpm install [name] 2. npm版本升级 # 查看版本 $ npm -v 2.3.0 #升级 npm cnpm install npm -g # 升级或安装 cnpm npm i
你猜这是小程序还是webapp跳转？--小程序Webview与Webapp交互传参
owilson的专栏
05-31 288
微信小程序Webview与Webapp单页分享交互 在文章开始前，先来看一个效果。 两个跳转效果分别使用小程序webview跳转到原生小程序页面，以及webapp的路由跳转。 你能猜到第1种效果是采用什么跳转吗？ 熟悉bui开发的朋友可能已经猜到了，第1种的路由跳转采用的就是BUI的单页开发路由跳转（先加载再跳转），第2种是跳转到小程序的交互效果（先闪白再加载）。得益于单页路由动态加载组件的方式，整体体验感觉会更流畅，更舒服些。 一、开发方式的区别 有小程序，为何还要用webview组..
vue-cli打包后本地运行dist文件中的index.html操作
10-14
打包后的dist文件夹是存放所有打包生成的静态资源的地方，包括index.html、JavaScript文件、CSS文件等。 在打包完成后，我们通常需要将dist文件夹中的内容部署到服务器上，但在部署之前，往往需要在本地环境中测试...
详解vuejs中执行npm run dev出现页面cannot GET/问题
10-15
主要介绍了详解vuejs中执行npm run dev出现页面cannot GET/问题，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
npm run build 打包这些玩意
01-08
在开发Web应用时，`npm run build` 是一个常见的命令，用于将项目打包为生产环境可用的静态资源。这个过程涉及到一系列的构建步骤，包括编译、压缩、优化等，确保应用能够在部署后正常运行。以下是一些关于 `npm run...
解决打包文件 加载资源报错 because its MIME type (‘text/html‘) is not a supported stylesheet MIME type
热门推荐
weixin_48337403的博客
11-23 3万+
关于vue-cli打包文件出现问题加载问题 出现这种问题,大多都是路径问题 事情是这样的,最近打包的文件放在服务器上,一直报错,发现资源加载问题,于是上网查找全是关于相对路径的设置问题.但是,修改路径后,基础资源加载没有问题了,但是路由下的页面依然报错,并且是这样的报错. 意思很简单: 拒绝从‘ …’加载应用样式，因为它的MIME类型(‘text/html’)不是受支持的样式表MIME类型 不仅仅css,包括js也出现了相同的问题 后来发现居然跟路由模式也相关,其他项目中默认路由模式是hash,而当前的路
WebApp,BUIApp 结合Dcloud平台(HBuilder) 打包
qq_095的博客
08-21 1841
Web App如何打包? 本文适用于任何的H5打包, 如果你是使用BUI开发的Webapp, 那会更加简单。 最后会有不同平台的打包效果对比, 可以下载安装测试. BUI Webapp的特点. 想了解更多,可以去BUI官网看. 关于Cordova的打包教程,可以看另外一位群友@伊何底止丶的文章. Cordova项目中使用BUI框架打包及常见解答 首先你已经创建好一个WebApp工程...
webapp结合Dcloud平台打包图文教程
weixin_34146805的博客
08-06 951
前言 最近一直有BUI Webapp的开发者在问, webapp如何打包? 这本身是属于第三方平台的事, 既然有开发者在问, 那我们针对这个问题, 也想对Webapp的打包做个总结, 本文适用于任何的H5打包, 如果你是使用BUI开发的Webapp, 那会更加简单. 最后会有不同平台的打包效果对比, 可以下载安装测试. BUI Weba...
chrome出现MIME type is not executable
行走的IT
03-16 3万+
chrome出现MIME type is not executable 错误信息： because its MIME type ('text/plain') is not executable, and strict MIME type checking is enabled. 情景： 在一个页面动态引入github上的js文件。 问题原因：github动态加载js文件时返回co
webpack because its MIME type (‘text/html‘) is not a supported stylesheet MIME type错误
yijie_0_的博客
09-18 2052
今天安装webpack试运行的时候出现css引用错误，查了很久都说是路径错误什么的，但是没写错就是总报错，后来觉得应该是跟webpakc-dev-server 中设置的路径有关系，去webpack.base.js看了下果然是 修改前： 修改后： 就可以正常访问了 ...
MIME type 问题的解决
weboof的博客
04-08 1万+
出现背景：在angular项目最后的打包部署阶段，打包成一个dist静态文件夹，其内放置的是一些静态文件，然后在编辑器中直接运行index.html，出现以下错误：Refused to execute script from 'URL' because its MIME type ('text/html') is not executable, and strict MIME type check...
vue项目在服务器上报错,typescript + vue 项目通过yarn打包后丢到服务器上打开报错，本地运行没问题...
weixin_42131261的博客
08-11 523
如图所示， 感觉是路由加载的问题，麻烦大佬看下代码name 报undefined的地方是这里index.tsimport Vue from 'vue';import VueRouter from 'vue-router';import routeConfig from './route-config';Vue.use(VueRouter);const router = new VueRouter(...
its MIME type ('text/html') is not executable, and strict MIME type checking is enabled（非404）
大猴子
01-08 1万+
新项目导入资源时产生下面报错：来自“http://127.0.0.1:8089/login/login”的资源已被阻止，因为 MIME 类型不匹配（X-Content-Type-Options: nosniff）Refused to execute script from 'http://127.0.0.1:8089/js/bootstrap.js' because its MIME type ('
vue打包上线测试常见问题:
SunPeng的博客
08-26 673
vue打包上线测试常见问题:,vue打包项目线上报错net::ERR_ABORTED 404 (File not found):,vue打包后dist目录下的index.html网页显示空白的问题:
Vite + Vue3 + Ts 解决打包生成的index.html页面显示空白、资源跨域、找不到资源、404-Page Not Found等错误；关于vite build后访问报错
qq_44535402的博客
07-20 1万+
关于Vite打包后本地访问打包文件空白页面 ；关于vite build后访问报错：Expected a JavaScript module script but the server responded with a MIME type of “
vue2中用npm run build打包成dist文件上传服务器后怎么在网址中显示页面名称
最新发布
04-05
在Vue2中使用npm run build打包成dist文件后，可以通过修改服务器的配置文件来实现在网址中显示页面名称。 1. 首先，需要在服务器上配置一个反向代理，将所有请求都转发到index.html文件中。这可以使用Nginx或...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值