h3llr4iser · February 28, 2018 08:16
diff --git a/app.js b/app.js
 import App from './components/App.vue';
 import Vue from 'vue';
 new Vue({
  el: '#app',
  render: h => h(App)
 });
diff --git a/App.vue b/App.vue
 <template>
  <div id="app">
    {{ message }}
  </div>
 </template>
 <script>
  export default {
    data() {
      return {
        message: 'Hello World'
      }
    }
  }
 </script>
diff --git a/DefaultController.php b/DefaultController.php
 <?php

 namespace App\Controller;

 use Symfony\Component\HttpFoundation\Response;
 use Symfony\Component\Routing\Annotation\Route;
 use Symfony\Bundle\FrameworkBundle\Controller\Controller;

 class DefaultController  extends Controller
 {
    /**
     * @Route("/")
     */
    public function home()
    {
        return $this->render('home.html.twig');
    }
 }
diff --git a/home.html.twig b/home.html.twig
 <!DOCTYPE html>
 <html>
    <head>
        <meta charset="UTF-8">
        <title>{% block title %}Welcome!{% endblock %}</title>
        {% block stylesheets %}{% endblock %}
    </head>
    <body>
        {% block body %}
            <div id="app">SALUT</div>
        {% endblock %}
        {% block javascripts %}
        {% endblock %}
    </body>
 </html>
diff --git a/Project b/Project
 your-project/
 ├── assets/
 ├── bin/
 │   └── console
 ├── config/
 │   ├── bundles.php
 │   ├── packages/
 │   ├── routes.yaml
 │   └── services.yaml
 ├── public/
 │   └── index.php
 ├── src/
 │   ├── ...
 │   └── Kernel.php
 ├── templates/
 ├── tests/
 ├── translations/
 ├── var/
 └── vendor/
diff --git a/script b/script
 <script src="{{ asset('build/app.js') }}"></script>
diff --git a/webpack.config.js b/webpack.config.js
 var Encore = require('@symfony/webpack-encore');

 Encore
    // the project directory where compiled assets will be stored
    .setOutputPath('public/build/')
    // the public path used by the web server to access the previous directory
    .setPublicPath('/build')
    .addEntry('app', './assets/js/app.js')
    .cleanupOutputBeforeBuild()
    .enableSourceMaps(!Encore.isProduction())
    .enableVueLoader()
 ;

 module.exports = Encore.getWebpackConfig();
	import App from './components/App.vue';
	import Vue from 'vue';
	new Vue({
	el: '#app',
	render: h => h(App)
	});
	<template>
	<div id="app">
	{{ message }}
	</div>
	</template>
	<script>
	export default {
	data() {
	return {
	message: 'Hello World'
	}
	}
	}
	</script>
	<?php

	namespace App\Controller;

	use Symfony\Component\HttpFoundation\Response;
	use Symfony\Component\Routing\Annotation\Route;
	use Symfony\Bundle\FrameworkBundle\Controller\Controller;

	class DefaultController extends Controller
	{
	/**
	* @Route("/")
	*/
	public function home()
	{
	return $this->render('home.html.twig');
	}
	}
	<!DOCTYPE html>
	<html>
	<head>
	<meta charset="UTF-8">
	<title>{% block title %}Welcome!{% endblock %}</title>
	{% block stylesheets %}{% endblock %}
	</head>
	<body>
	{% block body %}
	<div id="app">SALUT</div>
	{% endblock %}
	{% block javascripts %}
	{% endblock %}
	</body>
	</html>
	your-project/
	├── assets/
	├── bin/
	│ └── console
	├── config/
	│ ├── bundles.php
	│ ├── packages/
	│ ├── routes.yaml
	│ └── services.yaml
	├── public/
	│ └── index.php
	├── src/
	│ ├── ...
	│ └── Kernel.php
	├── templates/
	├── tests/
	├── translations/
	├── var/
	└── vendor/
	var Encore = require('@symfony/webpack-encore');

	Encore
	// the project directory where compiled assets will be stored
	.setOutputPath('public/build/')
	// the public path used by the web server to access the previous directory
	.setPublicPath('/build')
	.addEntry('app', './assets/js/app.js')
	.cleanupOutputBeforeBuild()
	.enableSourceMaps(!Encore.isProduction())
	.enableVueLoader()
	;

	module.exports = Encore.getWebpackConfig();