Блог

Главная - Вопросы по программированию - Как использовать CDN-скрипт с Shopify

Как использовать CDN-скрипт с Shopify

#javascript #vue.js #shopify #liquid #cdn

Вопрос:

Я пытаюсь использовать Shopify для разработки темы Shopify с помощью интерфейса командной строки Shopify и магазина 2.0. Я попытался установить Vue с помощью скрипта CDN в своей теме.жидкость

 <script src="{{ 'vue.global.js' | asset_url }}"></script>

Когда я использую его таким образом, все работает нормально, и Vue Devtools обнаруживает VueJS, но я получаю эту ошибку при проверке темы

 Missing async or defer attribute on script tag

Когда я добавляю атрибут async или defer в свой тег скрипта, Devtools больше не обнаруживает VueJS

введите описание изображения здесь

Как я могу добавить Vuejs в Shopify без этой ошибки, пожалуйста?

Ответ №1:

У вас есть возможность игнорировать theme.liquid проверку ParserBlockingJavaScript.

В вашей теме проверьте файл конфигурации ( .theme-check.yml ), найдите ParserBlockingJavaScript и добавьте файл, который вы хотите игнорировать. В вашем случае:

 ParserBlockingJavaScript:
  enabled: true
  ignore:
    - layout/theme.liquid

или вы можете отключить эту проверку глобально, изменив значение включено на ложь.

Но еще один вариант для вас-отключить проверку только для этого конкретного кода:

 {% comment %}theme-check-disable ParserBlockingJavaScript{% endcomment %}
<script src="{{ 'vue.global.js' | asset_url }}"></script>
{% comment %}theme-check-enable ParserBlockingJavaScript{% endcomment %}

Вы можете найти более подробную информацию здесь о различных проверках: https://github.com/Shopify/theme-check

Метки: