Why is webpack encore required only in dev - symfony

I'm currently configuring some docker images for a symfony 5 project and trying to deal with the production build. Doing so, I noticed that webpack encore is installed only on dev mode, as advised on this official documentation : https://symfony.com/doc/current/frontend/encore/installation.html :
yarn add #symfony/webpack-encore --dev
However, this doesn't make sense to me, since even in production, we are supposed to build the assets :
yarn encore production
Does anyone have clues about this ?
Thank you

The Symfony docs on How Do I Deploy My Encore Assets? provide two important things to remember when deploying assets:
1) Compile Assets for Production:
$ ./node_modules/.bin/encore production
Now the important part:
But, what server should you run this command on? That depends on how you deploy. For example, you could execute this locally (or on a build server), and use rsync or something else to transfer the generated files to your production server. Or, you could put your files on your production server first (e.g. via git pull) and then run this command on production (ideally, before traffic hits your code). In this case, you’ll need to install Node.js on your production server.
And the second important thing:
2) Only Deploy the Built Assets
The only files that need to be deployed to your production servers are the final, built assets (e.g. the public/build directory). You do not need to install Node.js, deploy webpack.config.js, the node_modules directory or even your source asset files, unless you plan on running encore production on your production machine. Once your assets are built, these are the only thing that need to live on the production server.
Simply put, in the production environment you only need the generated assets (usually /public/build directory content). In a simple scenario when you only need to load compiled Javascript and CSS files the Webpack is not used at runtime.
A possible solution how to deploy a Symfony application & assets
When deploying a Symfony app manually (without CI/CD) the following steps can be performed on the local machine or in a Docker container (assumes Symfony 4/5):
Export the source code from GIT repository with git-archive, e.g.: git archive --prefix=myApp/ HEAD | tar -xC /tmp/¹
Go to exported source code: cd /tmp/myApp
Install Symfony & other PHP vendors (see also the Symfony docs): composer install --no-dev --optimize-autoloader
Install YARN/NPM vendors (they'll be required to generate assets with Webpack): yarn install
Create production assets: yarn build (or yarn encore production)
(Install Symfony assets if needed: bin/console assets:install)
Now the code is ready to rsync it to the production server. You may exclude or delete the /node_modules, /var and even /assets directories and webpack.config.js (probably package.json & yarn.lock won't be needed either -- didn't tested it!) and run e.g.: rsync --archive --compress --delete . <myProductionServer>:<app/target/path/>
Resources on Symfony deployment:
How to Deploy a Symfony Application (Symfony docs)
How Do I Deploy My Encore Assets? (Symfony Frontend FAQ)
Do I Need to Install Node.js on My Production Server? (Symfony Frontend FAQ)
Production Build & Deployment (SymfonyCast)
¹ Untars on the fly the archived GIT repository into the /tmp/myApp directory instead of into a TAR archive. Don't miss the leading / in the --prefix flag! git-archive docs.

Related

How to utilize .ebextension while using CodePipeline

I'm using CodePipeline to deploy whatever is on master branch of the git to Elastic Beanstalk.
I followed this tutorial to extend the default nginx configuration (specifically the max-body-size): https://medium.com/swlh/using-ebextensions-to-extend-nginx-default-configuration-in-aws-elastic-beanstalk-189b844ab6ad
However, because I'm not using the standard eb deploy command, I dont think the CodePipeline flow is going into the .ebextension directory and doing the things its supposed to do.
Is there a way to use code pipeline (so i can have CI/CD from master) as well as utilize the benefits of .ebextension?
Does this work if you use the eb deploy command directly? If yes, then I would try using the pipeline execution history to find a recent artifact to download and test with the eb deploy command.
If CodePipeline's Elastic Beanstalk Job Worker does not play well with ebextensions, I would consider it completely useless to deploy to Elastic Beanstalk.
I believe there is some problem with the ebextensions themselves. You can investigate the execution in these log files to see if something is going wrong during deployment:
/var/log/eb-activity.log
/var/log/eb-commandprocessor.log
/var/log/eb-version-deployment.log
All the config files under .ebextension will be executed based on the order of precedence while deploying on the Elastic Beanstalk. So, it is doesn't matter whether you are using codepipeline or eb deploy, all the file in ebextension directory will be executed. So, you don't have to worry about that.
Be careful about the platform you're using, since “64bit Amazon Linux 2 v5.0.2" instead of .ebextension you have to use .platform.
Create .platform directory instead of .ebextension
Create the subfolders and the proxy.conf file like in this path .platform/nginx/conf.d/proxy.conf
In proxy.conf write what you need, in case of req body size just client_max_body_size 20M;
I resolved the problem. You need include .ebextension folder in your deploy.
I only copy the dist files, then I need include too:
- .ebextensions/**/*
Example:
## Required mapping. Represents the buildspec version. We recommend that you use 0.2.
version: 0.2
phases:
## install: install dependencies you may need for your build
install:
runtime-versions:
nodejs: 12
commands:
- echo Installing Nest...
- npm install -g #nestjs/cli
## pre_build: final commands to execute before build
pre_build:
commands:
- echo Installing source NPM dependencies...
- npm install
## build: actual build commands
build:
commands:
# Build your app
- echo Build started on `date`
- echo Compiling the Node.js code
- npm run build
## Clean up node_modules to keep only production dependencies
# - npm prune --production
## post_build: finishing touches
post_build:
commands:
- echo Build completed on `date`
# Include only the files required for your application to run.
artifacts:
files:
- dist/**/*
- package.json
- node_modules/**/*
- .ebextensions/**/*
Ande the config file /.ebextensions/.node-settings.config:
option_settings:
aws:elasticbeanstalk:container:nodejs:
NodeCommand: "npm run start:prod"

Magento 2 Grunt problems

I'm getting slightly confused with grunt and magento 2. Should I be using Grunt on the server or on my local machine? New to grunt so any pointers would be greatly appreciated.
Local machine. You don't need to run it in production, because you should be running setup:static-content:deploy with the Magento CLI when deploying to production, which will compile all static content for you.
For development, Magento 2 provides a Gruntfile.js.sample and a package.json.sample for local development. You should rename them to Gruntfile.js and package.json, and then install the dependencies with npm install. As long as you have grunt installed, you should be able to then run the grunt commands to compile your code while you are developing. You can see more info and the grunt commands here: http://devdocs.magento.com/guides/v2.0/frontend-dev-guide/css-topics/css_debug.html
You should also make sure that you are running your local development environment in "developer mode": http://devdocs.magento.com/guides/v2.0/config-guide/cli/config-cli-subcommands-mode.html#change-to-developer-mode
Grunt should be used locally and staging, whenever you have the application in developer mode. In production mode (live site) it shouldn't be used.

Composer misses to install certain files (app/console, AutoLoader.php, app_dev.php, etc.)

I am developing a web application with Symfony 2. The code of my own bundle that forms the heart of my application and some configurations files for application-wide settings are controlled by Git (mostly the directories, src/MyCompany/MyBundle, app/Resources/config, etc.) The rest is under control of Composer (the framework, 3rd party bundles, etc.)
Up to now, I ran a ./composer self-update && ./composer.phar update once in a while, pushed or fetched source code from the origin of my repository and everything has been working well.
Today, I started a new fresh working directory and experienced some odd problems.
I performed
git clone <my git repo url> www
cd www
composer.phar install
The composer.json is part of my repository, hence it normally suffices to excute Composer in order to install the framework and all required bundles to get a fully working copy of my web application.
But today, composer.phar install stopped prematurely complainig about missing files. Luckily, I still had my old working directory, so I could copy over the missing files manually, and restart composer.phar. I had to repeat these steps several times until I ended with a fully working application.
The files that were missing are
app/console
AutoLoader.php
app_dev.php
AppCache.php
I thought that these files are part of the Symfony framework and expected them to be installed by Composer. Fot this reason they are not under control of my revision control system.
I found this related question. The answer is very generic und not particularly helpful. All it says is that for example app/console should be included into revision control, because it is not installed by Composer (any longer) and that there is a change in the directory structure due to the transition from Symfony 2 to 3. But I know for sure that app/console was installed by Composer in the past. Hence, something changed.
This leads me to the following questions
Is there any complete, up-to-date and official documentation
what should be included in the repository
what should be in .gitignore
what is managed by Composer?
Is there any documentation how to do the transistion from the old directory structure to the new one in preperation of Symfony 3?
I thought I read all README.md, all release information and everything in "Living on the Edge" of the Symfony site, but somehow I missed this.
The clean way to install Symfony2 from scratch with composer, is to use the following command:
composer create-project symfony/framework-standard-edition my_project_name
This will ensure that all basic structures are created. After that, you can still insert your customisations from the previous project.
Then you can add everything – except app/config/parameters.yml as well as the contents of vendor/, app/cache and app/logs – to your repository.
About transitioning to SF3, I guess there’ll be an upgrade path as soon as SF3 is stable enough to create such a document.
1.1. that depends how you want people to be able to fetch your bundle
1.2. I share with you my own .gitignore: beware I use git for my own use to have a security for my files, not to allow people to get my bundle:
# Cache and logs (Symfony2)
/app/cache/*
/app/logs/*
!app/cache/.gitkeep
!app/logs/.gitkeep
# Cache and logs (Symfony3)
/var/cache/*
/var/logs/*
!var/cache/.gitkeep
!var/logs/.gitkeep
# Parameters
/app/config/parameters.yml
/app/config/parameters.ini
# Managed by Composer
/app/bootstrap.php.cache
/var/bootstrap.php.cache
/bin/*
!bin/console
!bin/symfony_requirements
/vendor/
# Assets and user uploads
/web/bundles/
/web/uploads/
# PHPUnit
/app/phpunit.xml
/phpunit.xml
# Build data
/build/
# Composer PHAR
1.3. everything that is in composer.json

What is the correct option to use Grunt locally and on the production server, --save or --save-dev?

The install page on the Grunt website gives the following suggestion
Grunt and Grunt plugins should be defined as devDependencies in your
project's package.json. This will allow you to install all of your
project's dependencies with a single command: npm install.
I want to use grunt to run some tasks that are specific to local development, e.g.
development: concatenate javascript, but dont minify
production: concatenate and minify javascript
If I install Grunt as a dev dependency, does this mean when I run NPM install on the production server - grunt will not be installed into node modules?
What is the correct option to be able to use Grunt both locally and on the production server?
It doesn't matter if you install Grunt as a dev dependency, it will still be installed when you run npm install.
The scenario where dev dependencies are not installed is when you run npm install <package> because the consensus is you are an end user looking to use (not build/test) the package. However, you can still include the dev dependencies by adding the --dev flag.
You should install grunt with --save-dev. What it does is add a line to your project's package.json. Similar to when you install any other node module with --save-dev. Then, if you run npm install on any machine with the same package.json, all those modules will be downloaded and installed locally, and usable by your project.
As for running different tasks in production and development, I assume you know how to configure grunt to do that.

Deploy full Symfony2 app with composer

Is there a way to setup a composer.json file in order to deploy a full Symfony 2.3 app?
Suppose I have the app in the git repo https://myrepo#bitbucket.org/myrepo/sfwebapp.git
As far as I know, composer is dependency manager, not deployment manager. Sure, you could:
Pull Git repo
Run composer --install (this is basically the essential step)
Warm up cache
Symlink resources
Install assets
...
PROFIT
BUT, You would need to manually:
Check/perform initial directory structure setup
Keep track of old deployments
...
So, bottom line, you could achieve it but it would be like reinventing the wheel.

Resources