高清无码一区二区在线观看吞精,一本大道大香蕉手机在线,久久人妻一区二区三区

相信用過vue的小伙伴，肯定被面試官問過這樣一個問題：在vue中動態(tài)的引入圖片為什么要使用require
有些小伙伴，可能會輕蔑一笑：呵，就這，因為動態(tài)添加src被當做靜態(tài)資源處理了，沒有進行編譯，所以要加上require，我倒著都能背出來......
emmm...乍一看好像說的很有道理啊，但是仔細一看，這句話說的到底是個啥？針對上面的回答，我不禁有如下幾個疑問：

什么是靜態(tài)資源？
為什么動態(tài)添加的src會被當做的靜態(tài)的資源？
沒有進行編譯，是指為是什么沒有被編譯？
加上require為什么能正確的引入資源，是因為加上require就能編譯了？

當我產(chǎn)生最后一個疑問的時候，發(fā)現(xiàn)上面的答案看似說了些啥，但好像又什么都沒說...... 如果各位看官老爺也有如上幾個疑問，那就讓我給大家一一解惑
1.什么是靜態(tài)資源與靜態(tài)資源相對應(yīng)的還有一個動態(tài)資源，先讓我們看看網(wǎng)上的各位大佬們怎么解釋的。

靜態(tài)資源：一般客戶端發(fā)送請求到web服務(wù)器，web服務(wù)器從內(nèi)存在取到相應(yīng)的文件，返回給客戶端，客戶端解析并渲染顯示出來。
動態(tài)資源：一般客戶端請求的動態(tài)資源，先將請求交于web容器，web容器連接數(shù)據(jù)庫，數(shù)據(jù)庫處理數(shù)據(jù)之后，將內(nèi)容交給web服務(wù)器，web服務(wù)器返回給客戶端解析渲染處理。

其實上面的總結(jié)已經(jīng)很清晰了。站在一個vue項目的角度，我們可以簡單的理解為：
靜態(tài)資源就是直接存放在項目中的資源，這些資源不需要我們發(fā)送專門的請求進行獲取。比如assets目錄下面的圖片，視頻，音頻，字體文件，css樣式表等。
動態(tài)資源就是需要發(fā)送請求獲取到的資源。比如我們刷淘寶的時候，不同的商品信息是發(fā)送的專門的請求獲取到的，就可以稱之為動態(tài)資源。
2.為什么動態(tài)添加的src會被當做的靜態(tài)的資源？回答這個問題之前，我們需要了解一下，瀏覽器是怎么能運行一個vue項目的。
我們知道瀏覽器打開一個網(wǎng)頁，實際上運行的是html，css，js三種類型的文件。當我們本地啟動一個vue項目的時候，實際上是先將vue項目進行打包，打包的過程就是將項目中的一個個vue文件轉(zhuǎn)編譯成html，css，js文件的過程，而后再在瀏覽器上運行的。
那動態(tài)添加的src如果我們沒有使用require引入，最終會打包成什么樣子呢，我?guī)Т蠹覍嶒炓徊?。

// vue文件中動態(tài)引入一張圖片<template><div class="home"><!-- 通過v-bind引入資源的方式就稱之為動態(tài)添加 --><img :src="'../assets/logo.png"" alt="logo"></div></template>//最終編譯的結(jié)果(瀏覽器上運行的結(jié)果)//這張圖片是無法被正確打開的<img src="https://www.huyubaike.com/assets/logo.png" alt="logo">

我們可以看出，動態(tài)添加的src最終會編譯成一個靜態(tài)的字符串地址。程序運行的時候，會按照這個地址去項目目錄中引入資源。而去項目目錄中引入資源的這種方式，就是將該資源當成了靜態(tài)資源。所以這也就回答了我們的問題2 。
看到這里估計就有小伙伴疑惑了，這個最終被編譯的地址有什么問題嗎？我項目中的圖片就是這個地址，為什么無法引入？別急，我們繼續(xù)往下看。
3.沒有進行編譯，是指的是什么沒有被編譯？沒有進行編譯。這半句話，就聽得很讓人懵逼了。按照問題2我們知道這個動態(tài)引入的圖片最終是被編譯了，只是被編譯之后無法正確的引入圖片資源而已。所以這句話本來就是錯的。針對于我們的標準答案，我在這里進行改寫：
因為動態(tài)添加src被當做靜態(tài)資源處理了，而被編譯過后的靜態(tài)路徑無法正確的引入資源，所以要加上require