nuxt引用static或者assets目錄下資源注意事項

原創 曹天骄 2020-02-20 20:20

Nuxt 服務器啓動後，會將static文件目錄映射到根路徑/下。

所以想引用static目錄下圖片，直接寫法如下

<img src="/log.png"/>

引用assets目錄下文件，寫法如下

<img src="~/assets/logo.png"/>
曹天驕
發佈了253 篇原創文章 · 獲贊 68 · 訪問量 39萬+
他的留言板 關注
發表評論
所有評論
還沒有人評論，想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章

nuxt中使用axios/@nuxtjs/axios 以及使用mock

1. 搭建nuxt項目：參考https://blog.csdn.net/qq_42231156/article/details/90174203。 2. nuxt中使用全局@nuxtjs/axios：參考：https://blog.csd

Ace.斗皇 2020-06-23 04:19:30

nuxt.js使用swiper5+

1. 下載：npm install swiper --save 2. 再nuxt.config.js引入swiper.css： module.exports = { css: [ "assets/css/reset.css"

Ace.斗皇 2020-06-16 02:45:59

nuxt 腳手架創建nuxt項目中不支持import？解決方法↓

打開package.json，在dev和start末尾添加 --exec babel-node  在項目根目錄創建.babelrc文件，並在文件中編輯以下代碼 {     "presets": ["es2015"] }  執行以

senmegui 2020-07-05 08:15:45

查看源代碼顯示動態接口數據

  使用nuxt實現查看源代碼顯示動態數據： /** 通過nuxt框架實現服務端渲染 **/ 1>下載腳手架工具： github地址： https://github.com/nuxt/create-nuxt-app 2>下載gi

菜鸟老五 2020-07-02 14:31:37

vue路由傳參方式 nuxt

vue路由傳參常用的三種方式1、通過params來傳遞參數（本人常用）傳遞參數接收參數<li v-for="article in articles" @click="getDescribe(article.id)">2、通過path跳轉

人坚不拆-世间仅有 2020-06-30 13:17:25

nuxt 跳轉多級目錄頁面

當我們要訪問的文件是在下級目錄內的時候,路由的地址中間要用’-‘代替’/’ 如下 <nuxt-link class="subNav-li" :to="{name:'mobile-taxi'}"></nuxt-link> 這樣就

万花果子 2020-06-24 09:26:32

nuxt專題分享

之前做nuxt項目，這次又做一次，我會分享nuxt基礎的配置，及一些nuxt的坑。 用nuxt一定要用服務端渲染，如果打包靜態資源，layout是有問題的

godnan_kk 2020-06-23 23:09:24

nuxt筆記（一）nuxt中scss使用並可全局使用變量

1.插件安裝： npm install css-loader node-sass postcss-loader sass-loader style-loader --save -dev 2.在項目的assets目錄下新建一個cs

万物皆可爱 2020-06-22 10:36:06

nuxt.config,js 配置 scss（less），實現全局樣式，全局變量，全局混合

前言 nuxt 學習之路 - nuxt.config.js 配置篇，進行 scss 配置，實現全局樣式，全局變量，全局混合（以 scss 爲例， LESS 和 Stylus的配置方式相同） 一、配置全局 scss，每個頁面都引入

大华阿大华 2020-06-21 20:38:20

nuxt.config,js 配置 Element-ui 懶加載，實現ui框架按需加載，優化 vendors 大小

前言 nuxt 學習之路 - nuxt.config.js 配置篇。通過實現框架懶加載來實現優化項目打包體積大小。（本篇使用 element-ui 爲例，使用插件 babel-plugin-component）。 一、未優化前

大华阿大华 2020-06-21 20:38:20

nuxt百度地圖引入基礎使用，百度地圖初始化，行政區劃劃分

如何在nuxt項目中使用百度地圖 進入百度地圖API 選擇javascriptAPI，按照流程註冊賬號獲取ak，複製ak 按照頁面提示的，需要引入script標籤 這裏我們打開nuxt項目中的nuxt.config.js文件，

程序员徐金 2020-06-21 03:41:22

nuxt項目部署（windows環境）

項目是由vue-cli轉換過來的，編碼工作是前端兄弟做的，然後給到我這邊去部署，我壓根不懂nuxt項目，這可把我折騰壞了，還好最後還是搞定了 (^▽ ^)，趕緊記錄一下。 首先把配置貼上來： package.json { "n

丶spare 2020-06-21 00:32:28

nuxt.js 究極按需引入-ant design vue

在網絡上看了很多ui組件按需加載的案例，但是那不是我想要的 1. 首先我們看一下 錯誤的示範！！ 1.1.配置插件 plugins\antd-ui.js import Vue from 'vue' import Button f

LuckRain7 2020-06-16 09:51:36

前端nuxt部署shell

npm i npm run build rm -rf ./clueapp.tar.gz pm2 delete clue-dev npm i npm run prd

godnan_kk 2020-06-16 07:44:36

nuxt前端實現文件下載功能

在plugins裏建一個js文件，文件內容如下： import FileSaver from 'file-saver'; const Json2csvParser = require('json2csv').Parser; import 

godnan_kk 2020-06-16 07:44:36