Organizing assets in Symfony3 - symfony

I still have some problems to handle my assets in symfony. The best practices say, I should store my assets in web/.
But I dont like to store my raw sass files there, because its a public folder and I think only compiled or static files should be stored there.
Thats why I store them (js and sass) currently in app/Resources. And my assetic.read_from is app/Resources. But then there are some bundles, that are symlinked by assets:install to web/bundles/.
And now, when I want to include this bundle-assets in my twig files, I have to go there by ../../web/bundles/.. in the stylesheets block. That doesnt look very clean, so I did a symlink app/Resources/bundles->web/bundles/ and that works.
But I still think its too much fiddle and I would like to know if there is a cleaner way that better collects my assets in one place.

Don't use AsseticBundle, it was even removed in default symfony-standard 2.8. Managing frontend assets with php is workaround for someone who really don't want to use "the right tools"
I personally keep my source files in /assets/ and with Grunt JS I compile them to /web/assets/ which later is served from assets.somedomain.com through CDN
2 years ago I wrote post about managing assets with symfony, it's still valid and up to date. You might want to check it out.
http://konradpodgorski.com/blog/2014/06/23/better-way-to-work-with-assets-in-symfony-2/
I should extend post by things I learned since then but always not enough time :)

I don't see why you can't use web/ folder for your assets.
I often work with less and other file format which are afterward processed and minified.
The solution to your problem seems simple to me: Use two folder in the web/ folder.
The first folder would be your source/ folder. In which you would place all your sass files. You will add a .htaccess file to this same folder, and deny all access (you can copy from the .htaccess file in the src/ folder).
Then a second folder, lets call it assets which will hold all your compiled and minified assets.
That should do the trick... ;)
You may be interested in this topic as well. It may help to hide futher the existence of your source/ folder. ;)
If you really don't want to have your sources files in the web/ folder, then loot at this, it should help you place your sources files in your bundle.

Related

How to edit a scss file in django-cms?

I have been searching all over for information on where django-cms is storing the CSS and SCSS data for my site, which I am working on localhost. When I go to edit the CSS file directly, it has no effect, so I'm wondering what needs to be done to edit those CSS files. Obviously they have been loaded somewhere. How can they be reloaded, or in general what is the best practice for editing the CSS files?
Apparently I had to do this with both the style.scss and style.css files, which seem to have the same css classes. But even after editing both files, I had to refresh the site on my localhost a few times before I could see the changes. Frustrating, but it does work to edit the files directly in the static folder.
#Lawrence DeSouza At first you should mention which plugins and style frameworks you use.
If you are using some sort of a frontend framework like Bootstrap 4 your should compile its css from scss separately. You can do it right on the dev server in a separate directory outside your project dir and cloned from the official repository. Normally you would only need to change variables in "/bootstrap-4.x.y/scss/_variables.scss" file. On the next step you would compile your *.css files with "npm run dist" command and then copy compiled files from "/bootstrap-4.x.y/dist" directory to your "/projectname/appname/static/css" directory. The process is well-documented here. After copying changed files to your "static" folder you should run "python manage.py collectstatic" and refresh the page. If it's not working after refreshing the page in a browser (normally it should work) - restart the server. I am a bit biased towards Bootstrap, but the logic should be the same in your case.

How to put a Template together with Ruby on Rails

I have a template, one of those you could buy, with many css/js/images, very beautiful.
But I have to control these pages with Ruby on Rails, which I am still learning.
The template files have many directives for other files and folders.
I am trying to understand the Assets Pipeline and I am feeling that it looks not good.
There are dozens of css files, with the directives for many images that are placed in other folders.
I am very scared to be straightforward.
I am not the project owner, I just have these two requirements:
Use this template
Build the system in Ruby on Rails
Could someone indicate me the correct way to get along with this situation.
Thanks a lot.
There is no direct solution to this, but may be this can help: install_theme gem. I haven't used it but the link shows how to use an html/css/js theme in rails application.
Friends,
There is a solution for dummies!
I am feeling so fool.
Inside Rails folders, there is a folder called public
We just have to put our css/js/images inside this folder.
For example, in my template, the index.html was in the same folder then a folder called assets which has sub folder css, js, images
So, the files need for index.html were (relatively to it) in assets/css/... or assets/js/...
Thus, all I had to do was copy my whole folder assets to inside the public directory below Ruby on Rails files.
I found it here:
The Asset Pipeline
I am sorry for the dummy question.
Thanks a lot!

How to ignore changes in WordPress cache files in Git?

Every time I make a change to one of the WordPress theme files for my site there will be a lot of deleted cache files that automatically follow. Should I commit these changes using Git also or just ignore them? If the latter, what is the proper code I would use for this?
Thank you.
Well, I dont use wordpress, but if you are looking to ignore them you should have a file called .gitignore, and you are going to want to add those files (or if they are all in a folder, the folder) to the .gitignore file. https://github.com/DragonToothSoftware/SLang/blob/lexer-mod/.gitignore here is what mine looks like. It eliminates all of the cmake cache files
You should use a .gitignore file to exclude these files. They are auto-generated, so no need to keep them in repository

how to hide development assets in symfony2?

I have a folder structure for my js and css-files in the public folder like this:
public
js
dev
prod
css
dev
prod
Basically the dev files contain the not-minified files. where as the prod folder contains the minified files.
But actually I would prefer to not have the dev-files publicly available and load them only when I as a developer am in dev-mode.
How do i go about this?
You have no need for prod version of those files and should delegate the creation of those to Assetic which compiles them, by default, to /web/{css|js}/ directory.
Read more about Assetic here: http://symfony.com/doc/current/cookbook/assetic/index.html
Pay special attention to Filters section..
a quick and simply hack could be to have your dev assets somewhere else, maybe
web/custom/assetsDev
and in the Ressources/Public folder you make a symlink on all dev machines to the dev assets like:
ln -s js/ /yourProject/web/custom/assetsDev/js
dont forget to put both directorys in
.gitignore
dont know if that suits for this case, but in theory it should be working and you dont have to configurate anything inside the app

How to create cms templates from HTML files via GruntJS?

In my webdesign process i use jade, sass, coffe etc. to generate static files via a GruntJS watch task into a dev folder. And most of the times after the build process is done, a cms comes along and want some templates to work. Thats usually html files with some php/ruby/python tags in it. Let´s say it´s a Wordpress Theme.
The Problem is:
i have to modify my generated files in the dev folder directly
when im modifing my source jade, html, coffee - files, the dev folder would be overwritten
if i clone the static files and move them into the theme folder, i have to apply manually every change i made to the src/dev folder to the cloned theme template files.
that´s very odd. So i´am in need of a grunt task that maybe...
generate the templates for me out of the static files (via a json mapping file)
generate the templates directly from the src files via special attributes, comments or something similar
There´s just one thread i found where the user tries to accomplish the same with jsdom.
Can someone help me to find a existing tool that accomplish such a task or do i have to build it on my own?
Thanks, Robert
Check out grunt-usemin
Replaces references to non-optimized scripts or stylesheets into a set of HTML files (or any templates/views)

Resources