Vue 构建时字体包文件丢失
Posted
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了Vue 构建时字体包文件丢失相关的知识,希望对你有一定的参考价值。
参考技术A 原本项目执行构建命令,字体包能正确输出到指定位置,但是随着打包的文件增加,发现 dist/fonts 文件夹内字体包丢失了使用 vue inspect 检查配置,结果:
猜测是 limit 过小导致的,在 vue.config.js 修改配置
执行构建,字体包正确输出~
Vue JS 构建不导入 CSS 文件
【中文标题】Vue JS 构建不导入 CSS 文件【英文标题】:Vue JS Build not Import CSS Files 【发布时间】:2021-02-25 18:19:26 【问题描述】:我导入到我的 Vue 项目并在“npm run serve”部分运行的 CSS 代码在“npm run build”之后在我的服务器上不起作用。这可能是什么原因?当我在本地计算机上打开dist文件中的索引文件时,它说CSS丢失,并没有说服务器上有任何错误。
main.js
import Vue from 'vue'
import App from './App.vue'
import VRouter from './router'
import VStore from './configurations/storeConfiguration'
import V18n from './configurations/languageConfiguration'
// Special CSS Library ( UA )
import "./assets/scss/ua.css";
出现的 CSS 文件出现在开发环境中。但是,它不会出现在服务器环境中。
package.json
"name": "driver",
"version": "0.1.0",
"private": true,
"sideEffects": false,
"scripts":
"serve": "vue-cli-service serve",
"build": "vue-cli-service build",
"lint": "vue-cli-service lint"
,
"dependencies":
"@fortawesome/fontawesome-svg-core": "^1.2.32",
"@fortawesome/free-solid-svg-icons": "^5.15.1",
"@fortawesome/vue-fontawesome": "^2.0.0",
"axios": "^0.20.0",
"bootstrap": "^4.5.3",
"bootstrap-vue": "^2.17.3",
"core-js": "^3.6.5",
"epic-spinners": "^1.1.0",
"node-sass": "^4.14.1",
"sass": "^1.27.0",
"sass-loader": "^10.0.3",
"scriptjs": "^2.5.9",
"sweet-modal-vue": "^2.0.0",
"v-mask": "^2.2.3",
"vue": "^2.6.12",
"vue-analytics": "^5.22.1",
"vue-ctk-date-time-picker": "^2.5.0",
"vue-i18n": "^8.22.0",
"vue-input-mask": "0.0.11",
"vue-router": "^3.4.7",
"vue-suggestion": "^1.1.0",
"vue-sweetalert2": "^4.0.0",
"vue-the-mask": "^0.11.1",
"vue-toastification": "^1.7.8",
"vuex": "^3.5.1"
,
"devDependencies":
"@vue/cli-plugin-babel": "~4.5.0",
"@vue/cli-plugin-eslint": "~4.5.0",
"@vue/cli-service": "~4.5.0",
"babel-eslint": "^10.1.0",
"eslint": "^6.7.2",
"eslint-plugin-vue": "^6.2.2",
"vue-template-compiler": "^2.6.11"
,
"eslintConfig":
"root": true,
"env":
"node": true
,
"extends": [
"plugin:vue/essential",
"eslint:recommended"
],
"parserOptions":
"parser": "babel-eslint"
,
"rules":
,
"browserslist": [
"> 1%",
"last 2 versions",
"not dead"
]
【问题讨论】:
【参考方案1】:首先要做的事情: npm run serve 不提供 dist 文件的内容 检查:How to run production site after build vue cli
您介意显示一些代码以便我们分析您的问题吗?
【讨论】:
尝试将 css 导入您的 index.html 文件 当我这样做时,我的测试环境中的 CSS 代码也不起作用。它发生在服务器上。 我也把SRC文件夹发到服务器了,问题解决了。谢谢你.. 我只在静态服务器上部署了 nuxt 应用,我从来不用部署 src 文件夹,只部署 dist 文件夹的内容以上是关于Vue 构建时字体包文件丢失的主要内容,如果未能解决你的问题,请参考以下文章
Vue+elementUI npm run build打包之后字体 图标丢失问题
当我在 vue 组件上输入另一个输入时,为啥输入文件的值丢失?