vue樣式中背景圖片路徑_vue打包css文件中背景圖片的路徑問題

vue-cli寫完的靜態頁面我們在node環境中引入沒有問題,但是打包后放在Apache環境下,路徑卻有問題了

如一個簡單css語句

.all_bg {

background: url(../images/all_bg.png) 0 0 no-repeat;

display: inline-block;

overflow: hidden;

background-size: 200px 300px;

}

但是打包后路徑成了卻出現404訪問不到的問題。

解決的辦法很簡單

build路徑下utils.js文件

// Extract CSS when that option is specified

// (which is the case during production build)

if (options.extract) {

return ExtractTextPlugin.extract({

use: loaders,

fallback: 'vue-style-loader',

publicPath:'../../' //添加此代碼解決css樣式中背景圖片路徑問題

})

} else {

return ['vue-style-loader'].concat(loaders)

}

本文來自互聯網用戶投稿,該文觀點僅代表作者本人,不代表本站立場。本站僅提供信息存儲空間服務,不擁有所有權,不承擔相關法律責任。
如若轉載,請注明出處:http://www.pswp.cn/news/457270.shtml
繁體地址,請注明出處:http://hk.pswp.cn/news/457270.shtml
英文地址,請注明出處:http://en.pswp.cn/news/457270.shtml

如若內容造成侵權/違法違規/事實不符,請聯系多彩編程網進行投訴反饋email:809451989@qq.com,一經查實,立即刪除!

相關文章

如果我們不曾相遇

五月天的演唱會定的是9月10號,周六晚上7點。 而我,差不多,從一周前就開始準備了,因為公司最近在趕工,特別忙。為了周末不加班我提前一周就旁敲側擊地詢問師父的時間安排,最后又耿直地告訴師父我的周末計劃&…

win下php的memcached的安裝與使用

1、memcache的php擴展與memcached服務器的區別? php要操作memcached就必須要安裝memcache的擴展, 在http://windows.php.net/downloads/pecl/releases/memcache/下載相應版本安裝。 而php要操作memcached就必須要有memcached的服務,不然沒有服…

git 常用命令筆記

#提交代碼會加上用戶名和郵箱 git config --global user.name 名字 git config --global user.email 郵箱 git config --global color.ui true#列出所有配置 git config --list#創建一個repository(倉庫) git init #可以看到一個.git目錄 ls -A #復制一個已有的項目 git clone …

mysql 表的存儲類型_MySQL數據表存儲引擎類型及特性

數據表類型(存儲引擎)常見引擎比對 特點 Myisam InnoDB Memory BDB Archive 存儲限制 無窮制 64TB 有 沒有 沒有 事務安然 - 支撐 - 支撐 - 鎖機制 表鎖 行鎖 表鎖 頁鎖 行鎖 B樹索引 支撐 支撐 支撐 支撐 - 哈希索引 - 支撐 支撐 - - 全文索引 支撐 - - - - 集群索引 - 支撐 -…

78.Subsets

Given a set of distinct integers, nums, return all possible subsets. Note: The solution set must not contain duplicate subsets. For example,If nums [1,2,3], a solution is: [[3],[1],[2],[1,2,3],[1,3],[2,3],[1,2],[] ]昨天中秋加上頭非常痛,歇了一天…

python xyz_python中xyz坐標的歐幾里德距離

使用生成器表達式的簡單解決方案From PEP 289 Generator ExpressionsRationaleExperience with list comprehensions has shown their widespread utilitythroughout Python. However, many of the use cases do not need to have a full list created in memory. Instead, the…

[轉載]SYSCALL_DEFINE宏定義

來源:http://blog.csdn.net/p_panyuch/article/details/5648007 SYSCALL_DEFINE3 在何處定義? #define SYSCALL_DEFINE3(name, ...) SYSCALL_DEFINEx(3, _##name, __VA_ARGS__) #define SYSCALL_DEFINEx(x, sname, ...) / _…

java連接數據庫sql server_將SQL Server數據庫連接到Java

我的項目沒有使用任何IDE。整個編碼使用Textpad完成。所以我需要幫助連接sql server數據庫和我的項目。這是bean類,其中編寫了用于數據庫連接的業務邏輯。我已經安裝了SQL服務器并使用Windows身份驗證創建了一個名為“vt”的數據庫。我甚至為數據庫創建了dsn&#x…

ORM中的Model與DDD中的DomainModel

0.引言 在現有的系統開發中,大部分的系統應該都會用到ORM,無論用的是EF還是NHibernate。作為對象和持久化數據的橋梁,ORM確實非常方便,以至于在DDD的時候,我們很自然的將 ORM中的Model(實體)表達成DDD中的 DomainModel…

基礎總結

Unsafe Java線程池 HashCode 垃圾收集 關于引用(弱引用、強引用等等)轉載于:https://www.cnblogs.com/aquariusm/p/6340303.html

jsp java語法_JSP基礎語法

Java JSP 的 JSP基礎語法在本章中,我們將了解和學習JSP語法。并了解JSP開發涉及的簡單語法(即元素)的基本用法。為了方便演示,使用Eclipse創建一個動態Web項目:jspsyntax,用于運行以下涉及到的示例代碼。JSP的元素JSP的元素如下所…

iOS - Core Animation 核心動畫

1、UIView 動畫 具體講解見 iOS - UIView 動畫2、UIImageView 動畫 具體講解見 iOS - UIImageView 動畫3、CADisplayLink 定時器 具體講解見 iOS - OC NSTimer 定時器CADisplayLink 是一個能讓我們以和屏幕刷新率相同的頻率將內容畫到屏幕上的定時器。我們在應用中創建一個新的…

navicat 官方使用手冊,中文版,快捷鍵大全

2017年1月23日09:52:51 這個官方中文文檔很詳細 https://www.navicat.com.cn/manual/online_manual/cn/navicat/win_manual/index.html https://community.navicat.com/videos/cn 官方中文論壇部分視頻教程 快捷鍵 Navicat 主窗口 鍵動作CTRLG設置位置文件夾CTRL#(#…

Linux inode與文件系統關系

inode只有在linux文件系統的概念(ext3,ext4) 、inode節點數量與文件存儲的關系。 二、在文件系統初始化時設置合適的節點數量。 linux服務器在存儲文件小而數量多的情況下,需要考慮inode用完的情況。轉載于:https://www.cnblogs.com/lirunzhou/p/5883706…

評分系統 java_C自動評分系統

我無法按照規范完成作業 . 這是分配方案:大學迫切需要一個自動測試評分系統 . 使用C,為大學寫一個評分系統,并對至少五名學生的測試進行評分 . 要創建評分系統,請按照以下步驟操作:首先詢問測試中的問題數量然后詢問每…

當Terraform遇上ECS(一)——DataSource篇

背景 越來越多的公司已經熟知并運用“基礎設施即代碼”來構建和維護自己的云基礎設施。目前也有許多的自動化構建工具協助用戶通過腳本進行云資源的部署和生命周期的管理,如:Terraform、Ansible、Chef等。但是,在實施過程中,都遇到…

【BZOJ 1597】 [Usaco2008 Mar]土地購買 (斜率優化)

1597: [Usaco2008 Mar]土地購買 Time Limit: 10 Sec Memory Limit: 162 MBSubmit: 3601 Solved: 1322Description 農夫John準備擴大他的農場,他正在考慮N (1 < N < 50,000) 塊長方形的土地. 每塊土地的長寬滿足(1 < 寬 < 1,000,000; 1 < 長 < 1,000,000). …

深入淺出學java_《深入淺出學JAVA開發初級》

整體說明&#xff1a;Java私塾的這一套視頻是完全真實課堂錄制&#xff0c;實際上課時間為十一天&#xff0c;主要內容包括&#xff1a;1&#xff1a;系統完整的學習Java的基礎知識2&#xff1a;深入剖析重點知識點的理論3&#xff1a;超多的編程題目和程序講解4&#xff1a;最…

重定位與鏈接腳本

1.為什么需要重定位   位置無關編碼(PIC&#xff0c;position independent code)&#xff1a;匯編源文件被編碼成二進制可執行程序時編碼方式與位置&#xff08;內存地址&#xff09;無關。  位置有關編碼&#xff1a;匯編源碼編碼成二進制可執行程序后和內存地址是有關的。…

Linux bashrc和profile的用途和區別

導讀使用終端ssh登錄Linux操作系統的控制臺后&#xff0c;會出現一個提示符號&#xff08;例如&#xff1a;#或~&#xff09;&#xff0c;在這個提示符號之后可以輸入命令&#xff0c;Linux根據輸入的命令會做回應&#xff0c;這一連串的動作是由一個所謂的Shell來做處理。Shel…