How to embed vue in a Yii2 project?

Question

Yii

Hello, there is a project on Yii2, some pages are interactive applications. What is the best way to build a project, write an application separately and then just include the assembled js file? On some vue apps you will need to use router and store. It will also be necessary to write a chat, I also thought to write it on vue, how in this case to insert a chat on the site? how is the widget?

Answer 1

Are you using a webpack-based build?
In Yii2, you will need to make two layouts: one for regular pages ( view/layouts/main.php), the second for pages with Vue ( view/layouts/vue.php)
For dev mode, view/layouts/vue.phpyou need to include JS scripts in the file that generates npm start. To do this, open the source code of the page that webpack distributes and copy all the included <script>. Either manually or write a parser. It seems that these scripts have static names, so it's easier here. You can copy and forget once.
For the prod mode, you need to include in the layout view/layouts/vue.phpthe final compressed JS scripts that it generates npm run build- the difficulty here is that these scripts always have unique names.
I will try to make an example on github