打包之后打开dist的页面显示空白: 这个问题以前就处理过,是打包过程中出现错误频率较高的一种,可能有3处地方会出现这种情况 1、记得改一下config下面的index.js中bulid模块导出的路径。因为打包后的index.html里边的内容都是通过script标签引入的,默认显示的路径不对,打开肯定是空白的。 build: { index: path.resolv...
npm run build AI代码助手复制代码 打包生成的文件会在dist文件夹中 但有时候打开index.html 会出现空白页面 接下来我们从几个方面来进行分析: 一、打包时整体资源路径 根据实际情况要判断 是/ 还是 ./ 在vue-ui 里配置: 在vue.config.js里配置: module.exports = {//基本路径 文件打包后放的位置publicPath:...
解决@vue/cli3打包后页面空白 npm run build后,本地直接访问请求都是正确的,线上服务器也显示正常,就是页面空白,网上查找下资料。主要修改以下两个地方。 vue.config.js(项目根目录下) module.exports={runtimeCompiler:true,publicPath:'./',//输出的根路径 默认是/ 如果你的网站是app.com/vue 这更改此配置...
1.访问静态资源文件404(js、css等) vue3项目执行npm run build命令打包后,放到服务器下运行(部署流程与VUE2基本类似),访问的时候提示资源文件找不到: 访问的文件不存在,主要是因为路径配置问题。打包静态文件必须是根路径,否则放到服务器找不到静态资源(同理于webpack中的publicPath的配置)。解决方法为在项目根目录...
Vue打包后页面出现空白解决办法 Vue打包后页⾯出现空⽩解决办法 ⼀、 vue-cli创建项打包后打开页⾯为空⽩的问题解决 命令⾏输⼊：npm run build 打包出来后项⽬中就会多了⼀个⽂件夹dist，这就是我们打包过后的项⽬。⼆、打包完成后配置会⾃动⽣成vue.config.js⽂件，这个⽂件⾮常...
我用vue开发的一个小项目,项目开发出雏形,想打包一下放测试,但是我想放测试前自己检查一下经过npm run build打包生成的项目,在本地服务器能不能正常跑,于是,经过网上大哥的帮忙,写了个简易的koa服务器,将打包好的dist文件,放到了服务器上。 说一下我的dist文件的结构,dist/index.html dist/static 然后static目...
npm run serve 允许你本地启动这个项目 npm run build 将整个项目进行压缩构建到dist这个目录下(俗称打包) 我们会发现在npm run build之后生成的dist文件夹中有一个index.html, 如果你本地打开它的话并不能正常的显示出项目的内容, 而是会出现一个空白页, 打开控制台也是爆了一堆找不到js、css等资源文件的错误...
npm run build 执行以上命令,输出结果如下: 执行完成后,会在 Vue 项目下会生成一个dist目录,该目录一般包含 index.html 文件及 static 目录,static 目录包含了静态文件 js、css 以及图片目录 images(如果有图片的话)。 如果直接双击打开 index.html,在浏览器中页面可能是空白了,要正常显示则需要修改下 index.htm...
我在本地测试的时候还是显示页面空白,打开控制台发现报了: TypeError: Cannot read properties of undefined (reading '$store') 回到代码发现是我在使用Vuex的数据时按照往常习惯在前面加了this,我把this去掉重新npm run build打包,再打开npm run preview本地测试,错误就没了,页面也正常显示了。
运行npm run build,然后发现打包的文件打包到了src里,这边需要再修改一个build.outDir属性 outDir:path.resolve(__dirname,"") 再对配置代码进行一点修改,附上完整代码 import{fileURLToPath,URL}from"node:url";import{defineConfig}from"vite";importvuefrom"@vitejs/plugin-vue";importvueJsxfrom"@vitejs...