Chapters
21 Chapters
|
2:10:39
|
Login to bookmark this video
-
Course Code
Login or register to download the code!Compatible PHP versions: ^7.1.3
Login or register to download the code!Compatible PHP versions: ^7.1.3
-
This Video
Login or register to download the video!
Login or register to download the video!
-
Subtitles
Login or register to download the subtitles!
Login or register to download the subtitles!
-
Course Script
Login or register to download the script!
Login or register to download the script!
03.
Twig Helpers, entrypoints.json & yarn Scripts
Scroll down to the script below, click on any sentence (including terminal blocks) to jump to that spot in the video!
Subscribe to jump to this part in the video!
This tutorial works great with Symfony5!
What PHP libraries does this tutorial use?
// composer.json
{
"require": {
"php": "^7.1.3",
"ext-iconv": "*",
"aws/aws-sdk-php": "^3.87", // 3.91.4
"composer/package-versions-deprecated": "^1.11", // 1.11.99
"doctrine/annotations": "^1.0", // 1.10.1
"doctrine/doctrine-bundle": "^1.6.10", // 1.10.2
"doctrine/doctrine-migrations-bundle": "^1.3|^2.0", // v2.0.0
"doctrine/orm": "^2.5.11", // v2.7.2
"knplabs/knp-markdown-bundle": "^1.7", // 1.7.1
"knplabs/knp-paginator-bundle": "^2.7", // v2.8.0
"knplabs/knp-time-bundle": "^1.8", // 1.9.0
"league/flysystem-aws-s3-v3": "^1.0", // 1.0.22
"league/flysystem-cached-adapter": "^1.0", // 1.0.9
"liip/imagine-bundle": "^2.1", // 2.1.0
"nexylan/slack-bundle": "^2.0,<2.2.0", // v2.1.0
"oneup/flysystem-bundle": "^3.0", // 3.0.3
"php-http/guzzle6-adapter": "^1.1", // v1.1.1
"phpdocumentor/reflection-docblock": "^3.0|^4.0", // 4.3.0
"sensio/framework-extra-bundle": "^5.1", // v5.3.1
"stof/doctrine-extensions-bundle": "^1.3", // v1.3.0
"symfony/asset": "^4.0", // v4.2.5
"symfony/console": "^4.0", // v4.2.5
"symfony/flex": "^1.9", // v1.21.6
"symfony/form": "^4.0", // v4.2.5
"symfony/framework-bundle": "^4.0", // v4.2.5
"symfony/property-access": "4.2.*", // v4.2.5
"symfony/property-info": "4.2.*", // v4.2.5
"symfony/security-bundle": "^4.0", // v4.2.5
"symfony/serializer": "4.2.*", // v4.2.5
"symfony/twig-bundle": "^4.0", // v4.2.5
"symfony/validator": "^4.0", // v4.2.5
"symfony/web-server-bundle": "^4.0", // v4.2.5
"symfony/webpack-encore-bundle": "^1.4", // v1.5.0
"symfony/yaml": "^4.0", // v4.2.5
"twig/extensions": "^1.5" // v1.5.4
},
"require-dev": {
"doctrine/doctrine-fixtures-bundle": "^3.0", // 3.1.0
"easycorp/easy-log-handler": "^1.0.2", // v1.0.7
"fzaninotto/faker": "^1.7", // v1.8.0
"symfony/debug-bundle": "^3.3|^4.0", // v4.2.5
"symfony/dotenv": "^4.0", // v4.2.5
"symfony/maker-bundle": "^1.0", // v1.11.5
"symfony/monolog-bundle": "^3.0", // v3.3.1
"symfony/phpunit-bridge": "^3.3|^4.0", // v4.2.5
"symfony/stopwatch": "4.2.*", // v4.2.5
"symfony/var-dumper": "^3.3|^4.0", // v4.2.5
"symfony/web-profiler-bundle": "4.2.*" // v4.2.5
}
}
What JavaScript libraries does this tutorial use?
// package.json
{
"devDependencies": {
"@symfony/webpack-encore": "^0.27.0", // 0.27.0
"autocomplete.js": "^0.36.0",
"autoprefixer": "^9.5.1", // 9.5.1
"bootstrap": "^4.3.1", // 4.3.1
"core-js": "^3.0.0", // 3.0.1
"dropzone": "^5.5.1", // 5.5.1
"font-awesome": "^4.7.0", // 4.7.0
"jquery": "^3.4.0", // 3.4.0
"popper.js": "^1.15.0",
"postcss-loader": "^3.0.0", // 3.0.0
"sass": "^1.29.0", // 1.29.0
"sass-loader": "^7.0.1", // 7.3.1
"sortablejs": "^1.8.4", // 1.8.4
"webpack-notifier": "^1.6.0" // 1.7.0
}
}
24 Comments
Using Encore in a Virtual Machine
https://symfony.com/doc/mas...
getting an error when compliling
Running webpack ...
ERROR Failed to compile with 1 errors 8:31:03 PM
error in ../../##DEV/covinated/assets/app.js 8:31:03 PM
Module build failed (from ../../##DEV/covinated/node_modules/babel-loader/lib/index.js):
Error: Cannot find module 'C:\##DEV\covinated\node_modules\babel-loader\lib\index.js'
Require stack:
- C:\##DEV\covinated\node_modules\loader-runner\lib\loadLoader.js
- C:\##DEV\covinated\node_modules\loader-runner\lib\LoaderRunner.js
- C:\##DEV\covinated\node_modules\webpack\lib\NormalModule.js
- C:\##DEV\covinated\node_modules\@symfony\webpack-encore\lib\webpack-manifest-plugin\index.js
- C:\##DEV\covinated\node_modules\@symfony\webpack-encore\lib\plugins\manifest.js
- C:\##DEV\covinated\node_modules\@symfony\webpack-encore\lib\config-generator.js
- C:\##DEV\covinated\node_modules\@symfony\webpack-encore\index.js
- C:\##DEV\covinated\webpack.config.js
- C:\##DEV\covinated\node_modules\webpack-cli\lib\webpack-cli.js
- C:\##DEV\covinated\node_modules\webpack-cli\lib\bootstrap.js
- C:\##DEV\covinated\node_modules\webpack-cli\bin\cli.js
- C:\##DEV\covinated\node_modules\webpack\bin\webpack.js
- C:\##DEV\covinated\node_modules\@symfony\webpack-encore\bin\encore.js
at Function.Module._resolveFilename (node:internal/modules/cjs/loader:933:15)
at Function.Module._load (node:internal/modules/cjs/loader:778:27)
at Module.require (node:internal/modules/cjs/loader:1005:19)
at require (node:internal/modules/cjs/helpers:102:18)
at loadLoader (C:\##DEV\covinated\node_modules\loader-runner\lib\loadLoader.js:19:17)
at iteratePitchingLoaders (C:\##DEV\covinated\node_modules\loader-runner\lib\LoaderRunner.js:182:2)
at runLoaders (C:\##DEV\covinated\node_modules\loader-runner\lib\LoaderRunner.js:397:2)
at NormalModule._doBuild (C:\##DEV\covinated\node_modules\webpack\lib\NormalModule.js:812:3)
at NormalModule.build (C:\##DEV\covinated\node_modules\webpack\lib\NormalModule.js:956:15)
at C:\##DEV\covinated\node_modules\webpack\lib\Compilation.js:1367:12
Entrypoint app 13.3 KiB = runtime.js 10.7 KiB app.js 2.61 KiB
webpack compiled with 1 error
Hey Frédéric H.!
Hmm, I'm not sure why this would be happening. It's failing because it can't find a vendor file (i.e. a file in node_modules) but that file should be there. Specifically, it seems like it can't find
node_modules\babel-loader\lib\index.js.Try removing your node_modules directory and re-running
yarn installto install them fresh... perhaps there was some problem downloading those dependencies. If that doesn't work, try ayarn upgradein case some old dependency is causing weird issues.Let me know if any of this helps!
Cheers!
non still the same :( i'm using php 8.0 and the file is indeed there
Hey Frédéric H.!
Hmm. I just downloaded this course code and tried running webpack: I'm not having any problems :/. Did you also try running
yarn upgrade? Do you have any custom config for webpack or babel? It's definitely a strange error...Cheers!
i even tried with a blank project, and not even adding your course.
ok let's try that :)
Hello all. I'm mostly sure this comment should go not to this topic - but you're my last chance :D How could i use a twig macro function recursive for a multilevel dropdown menu? was trying to find some info on google, stackoverflow - and shamefully it was meaningless for me. I have builded a multidimensional array with parents and children that I'm sending to a twig template - but i don't know how to use it well :/ Would appreciate any comments or resources
Hey Andrejus,
Unfortunately, we don't have anything specific about this on SymfonyCasts. But I'll try to give you some tips :) First of all, you should create a template where declare that macro, and then import your macro on another template where you're going to print that menu. I suppose you did that already, and it should work well, because it's simple and we do this in your Twig tutorial. If you're not sure how to import the macro into a template and render it - watch that tutorial first. And then, I believe the trick will be in importing the macro in the same macro file, i.e. in your your template where is your macro definition, you can call this "{% import _self as macros %}" on the first line of the file. And this will give you an ability to call any macro on the same macro definition page via "macro.%yourMacroNameHere%", here's a little example:
Well, you have to think about arguments, as you will need to path what you're going to render as an argument, but the general idea is that simple.
I hope this helps!
Cheers!
Hey, sorry for a late response. I managed to google it out - still a big thanks for a response, it will be more than useful for future projects)
Thanks for the great tutorial :)
The encore_entry_link_tags('app') and encore_entry_script_tags('app') functions return empty strings for me. The asset function worked fine before. Im running the code on an nginx docker if this is a reason for this? I don't get any 404 errors or errors in general.
Hey Keryx,
Are you sure you have "app" entry point in your webpack.config.js file? When you run encore "./node_modules/.bin/encore dev --watch" in your terminal, do you see "app.js" and "app.css" files in the output? Are they exist in the public/build/ directory?
Btw, any chance you're trying to render multiple times in the same request? Because it will be rendered only once when you run it the first time, and render empty output for all further times, see this for more info: https://github.com/symfony/...
Cheers!
Thanks so much I thought the multiple rendering wouldn't be the problem in my code. But watching the twig debug data showed me that this was the case. I got a symfony docker environment from a git repository (because I wanted to save setup time ^^° and also want to work with docker later on) . There were some basic examples in it and probably some kind of packages and configurations that caused this. I now set up a completely new symfony 5 project and followed the instructions again and now it works all fine. Also I now no for sure that I don't have any unnecessary packages in my project. Thanks for leading me to my solution :). I guess I tried to save time in the wrong place :D.
Have a wonderful day thanks :)
Hey Keryx,
You're welcome, I'm happy you solved this problem! :)
Cheers!
Hi there! Thanks for these tutorials!
If anybody is using npm (like me) just type "npm run watch"
Regards!
Hey Alex,
Thanks for this tip! ;)
Cheers!
after run" ./node_modules/.bin/encore dev "
I 4 files written to public/build
Entrypoint app [big] = vendors~app.css vendors~app.js app.css app.js
Hey HAMMOUDA,
Great!
Cheers!
but i have problem app.js and app.css 404 not found
how are you importing them in your template?
{{ encore_entry_script_tags('appt') }}
it should be "app" but I believe you have this right on your code
i think my problem in my container nginx
Oh, yes, that may be the problem. Nginx must serve the file if it exists, if not, it should pass the request into the front controller (public/index.php)
Cheers!
"Houston: no signs of life"
Start the conversation!