vue项目用webpack打包后运行后找不到.ttf及.woff文件

webpack.base.config 文件中

修改前:

{
test: /\.css$/,
use: ExtractTextPlugin.extract({
use: [‘css-loader?minimize‘, ‘autoprefixer-loader‘],
fallback: ‘style-loader‘
})
},
{
test: /\.less$/,
use: ExtractTextPlugin.extract({
use: [‘css-loader?minimize‘,‘autoprefixer-loader‘, ‘less-loader‘],
fallback: ‘style-loader‘
}),
},

修改后:

{
test: /\.css$/,
use: ExtractTextPlugin.extract({
use: [‘css-loader?minimize‘, ‘autoprefixer-loader‘],
publicPath:‘./‘,
fallback: ‘style-loader‘
})
},
{
test: /\.less$/,
use: ExtractTextPlugin.extract({
use: [‘css-loader?minimize‘,‘autoprefixer-loader‘, ‘less-loader‘],
publicPath:‘./‘,
fallback: ‘style-loader‘
}),
},

就是增加了publicPath:‘./‘,(可能还是找不到,具体F12看报错,然后进行调整或改为 publicPath:‘../../‘或改为publicPath:‘../dist/‘, 看个人的配置 )

原文地址:https://www.cnblogs.com/me168/p/10424955.html

时间: 2024-10-10 02:22:15

vue项目用webpack打包后运行后找不到.ttf及.woff文件的相关文章

pyqt5程序使用py2exe打包后运行时报找不到Qt platform plugin ‘windows’错误

pyqt5程序使用py2exe打包后运行时报找不到Qt platform plugin 'windows'错误 现象描述: 64位windows系统下直接将pyqt5的plugins下的platforms文件夹复制到exe相同目录即可,但在32位系统下一直报找不到Qt platform plugin 'windows'错误. 解决方案: 在exe同目录下新建plugins文件夹,然后将platfroms文件夹移到新建的文件夹下,同时修改main方法,添加以下代码: QApplication.ad

【vue】饿了么项目-使用webpack打包项目

1.vue cli给我们提供了npm run build命令打包项目,在packa.json文件中scripts对象中有build属性,当我们执行npm run build时,就执行build对应的"node build/build.js"脚本 build完成后显示 进入项目文件夹,找到dist文件夹,这些是打包后产生的文件 2.webpack打包过程中会将css和js文件单独提取出来,且会根据path存放进相应的文件夹下,形成如上图的根目录,文件名是根据内容产生的哈希值,文件内容改变

VUE项目用hbuilder 打包为手机APP

一.测试项目是否可以正确运行    指令:npm run dev 首先我们先建立一个vue的项目,本人用的是vue-cli随便建立的,然后运行项目 不必非得是像我这样的,这一步的目的只是测试一下咱们的vue项目是否可以运行 二.修改路径(assetsPublicPath: './') 打开我们config中的js文件,修改assetsPublicPath的路径为"./"(下图的右下角位置) 三.打包文件  指令:npm run build 打包后会生成dist文件 四.把dist文件变

用vue-cli来搭建vue项目和webpack

vue-cli 用vue-cli来搭建vue项目 第一步:全局安装vue-cli p.p1 { margin: 0.0px 0.0px 0.0px 0.0px; font: 11.0px Menlo } span.s1 { } sudo npm install vue-cli -g 第二步:初始化一个项目 vue init webpack-simple projectName 第三步:把文件切换到初始化的项目中 cd projectName 第四步:安装依赖 npm install 当然也可以用

记录下自己VUE项目用Hbuider打包后启动白屏问题

刚用VUE做项目,之前测试时vue创建的自身项目打包都是启动OK没问题.今天打包自己的时,启动一直白屏.折磨了好久,百度了一堆.终于找到了方法. 首先是在config/index.js里面 build: { // Template for index.html index: path.resolve(__dirname, '../dist/index.html'), // Paths assetsRoot: path.resolve(__dirname, '../dist'), assetsSu

如何降低Vue.js项目中Webpack打包文件的大小?

https://blog.csdn.net/maray/article/details/50988500?utm_source=blogxgwz0 import Blur from 'vux/src/components/blur/index.vue' import Cell from 'vux/src/components/cell/index.vue' import Range from 'vux/src/components/range/index.vue' import Toast fr

Vue项目分环境打包的实现步骤

转:https://blog.csdn.net/xinzi11243094/article/details/80521878 方法一:亲测真的有效 在项目开发中,我们的项目一般分为开发版.测试版.Pre版.Prod版.Vue-cli的默认环境一只有dev和prod两个,之前每次要发布测试版或Pre版都是修改了源码中API地址后打包,这样很麻烦.如果能根据不同环境打包就完美了.网上搜集了许多资料,现在可以分环境打包程序了,至于怎么打,接着住下看吧. 第1步:安装cross-env 在项目目录下运行

将现有vue项目基于electron打包成桌面应用程序

一.前言 项目本来打算采用B/S架构去做的,只是在"人群中多看了你一眼",便直接撸了. 二.使用electron集成桌面应用 本身项目是使用vue-cli开发的,在使用electron之前,需要将本身的项目打包好后打开index.html能显示网页.因为刚接触便直接拿官方demo进行打包了. 1.克隆官方demo:git clone https://github.com/electron/electron-quick-start 2.cd electron-quick-start-&g

在Azure DevOps Server (TFS)中实现VUE项目的自动打包

概述 Vue.js(读音 /vju?/, 类似于 view)是一个构建数据驱动的 web 界面的渐进式框架.由于它在数据绑定.页面展示和使用简单方面有很大的优势,逐渐被越来越多的前端开发团队使用.本文介绍基于Azure DevOps Server,如何实现Vue框架前端代码的编译和打包. 代理服务器配置 Azure DevOps Server的自动化流水线,都基于代理服务器Agent Server,需要在你的代理服务器上安装部署好VUE自动打包所需要的环境,这里主要说明如何安装VUE需要Node