Как ссылаться на `baseUrl` в разделе` <style>`SFC vue.js?

Question

Как мы можем ссылаться на baseUrl в разделе <style> SFC vue.js?

/src/views/Home.vue
<style scoped>
@import url(<%= BASE_URL %>static/required_styles.css); // does not work
</style>

Структура каталогов:

|--public
|  --static
|     --required_styles.css
|--src
|  --views
|    --Home.vue

Непонятно, как это сделатьэто из документов по обработке статических активов:

https://cli.vuejs.org/guide/html-and-static-assets.html#the-public-folder

Answer 1

Общая папка предназначена для файлов, которые вы хотите обслуживать напрямую на сервере, не проходя через веб-пакет.Примером будет минимизированный CSS, стили которого вы используете.В этом случае вы просто добавите путь CSS к vue.config.js или к заголовку index.html.Если вы импортируете в тег style, css будет проходить процесс сборки (например, webpack), когда компонент будет скомпилирован.Это означает, что вы не должны помещать файл .css в папку public и должны использовать относительный путь для импорта.