Как использовать Vue для многостраничных сайтов?

Хочу исопльзовать Vue не для SPA приложения, а для многостраничного сайта для создания на нем отдельных интерактивных элементов. К примеру в HTML (именно в HTML страницы, а не в template application!) пишу так
<v-button>Кнопка на Vue</v-button>
<h1>Заголовок</h1>
<v-button>Кнопка 2 на Vue</v-button>

Никак не могу сообразить как такое сделать
  • Вопрос задан
  • 1829 просмотров
Решения вопроса 2
shmatuan
@shmatuan
Vue, Node, RoR
В дополнение к сказаному выше пример: https://codepen.io/andreysh/pen/XOzPMW
Ответ написан
shasoft
@shasoft Автор вопроса
Пришел к выводу что проще всего использовать вот такой шаблон. Т.е. будет одно приложение на каждую страницу
<!DOCTYPE html>
<html>
<head>
  <link href="https://fonts.googleapis.com/css?family=Roboto:100,300,400,500,700,900|Material+Icons" rel="stylesheet">
  <link href="https://cdn.jsdelivr.net/npm/vuetify/dist/vuetify.min.css" rel="stylesheet">
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no, minimal-ui">
</head>
<body>
  <div id="app">
    <v-app>
      <v-content>
        <v-container>Hello world</v-container>
		<v-btn small color='primary'>Primary</v-btn>
      </v-content>
    </v-app>
  </div>

  <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.min.js"></script>
  <script src="https://cdn.jsdelivr.net/npm/vuetify/dist/vuetify.min.js"></script>
  <script>
    new Vue({ el: '#app' })
  </script>
</body>
</html>
Ответ написан
Пригласить эксперта
Ответы на вопрос 2
@roman94
Для каждой страницы создаете отдельное приложение, на каждой странице подключаете соответствующий js файл
Ответ написан
dimovich85
@dimovich85
JS is everywhere
Думаю, nuxt.js подойдет (ssr):
https://youtu.be/HSbj0dKErtY
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы