Assetic/uglifyjs cookbook article #2406

Closed
wants to merge 5 commits into from

4 participants

@Sgoettschkes

This PR involves a new cookbook describing how to use uglifyjs with assetics.

Q A
Doc fix? no
New docs? yes
Applies to 2.0+
Fixed tickets #1841,#1099

Right now, I copied the yuicomposer cookbook and changed it tto uglifyjs where needed. Please suggest further changes to improve this cookbook.

Pleae also have a look at how the installation of ugliffyjs is done and if this fits "our" view of how it should be installed.

@stof stof commented on an outdated diff Mar 30, 2013
cookbook/assetic/uglifyjs.rst
+
+UglifyJs is build as an node.js npm module and can be installed using npm. First,
+you need to `install node.js`_. Afterwards you can install UglifyJs using npm:
+
+.. code-block:: bash
+
+ $ npm install -g uglifyjs
+
+.. note::
+
+ It's also possible to install UglifyJs for your symfony project only. To do this,
+ install it without the ``-g`` option and specify the path where to put the module:
+
+ .. code-block:: bash
+
+ $ npm install uglifyjs /path/to/symfony/app/Resources
@stof
Symfony member
stof added a note Mar 30, 2013

Be careful. This will install uglifyJs 2 by default while you use the filter for uglifyJs 1 later (there is 2 different filters in Assetic as the version 2 is not BC with the version 1)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
@peterrehm peterrehm commented on an outdated diff Apr 18, 2013
cookbook/assetic/uglifyjs.rst
+.. note::
+
+ It's also possible to install UglifyJs for your symfony project only. To do this,
+ install it without the ``-g`` option and specify the path where to put the module:
+
+ .. code-block:: bash
+
+ $ npm install uglify-js@1 /path/to/symfony/app/Resources
+
+ It is recommended that you install UglifyJs in your ``app/Resources`` folder
+ and add the ``node_modules`` folder to version control.
+
+.. tip::
+
+ This cookbook uses UglifyJs 1 instead of the newer version 2 to be compatible
+ with old assetic versions. If you wantt to use UglifyJs version 2, make sure

@Sgoettschkes There is a small typo with 'wantt'

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
@peterrehm

@Sgoettschkes @WouterJ How about mentioning UglifyCSS as well?

By the way, for me the install command was not working. I am getting errors with
that. Only global install worked at the end.

@weaverryan weaverryan commented on an outdated diff Apr 26, 2013
cookbook/assetic/uglifyjs.rst
@@ -0,0 +1,164 @@
+.. index::
+ single: Assetic; UglifyJs
+
+How to Minify JavaScripts with UglifyJs
+=======================================
@weaverryan
Symfony member

I think we should rename this entry so that it's more like an example of using a minification filter, where we use ugllifyjs as an example:

How to Minify CSS/JS Files (using UglifyJs and UglifyCss)

Then we can make some slight changes to make this entry a bit more general:

  • An intro paragraph that talks about how you can use different filters to minify CSS and JS files. We could mention the other filters available to do this: yui css, yui js (both deprecated), Closure, cssmin, jsmin, jsminplus.

  • Add a section about using UglifyCss. But here, we can skip most of the details - i.e. we don't need to really show detailed install, since we've shown for UglifyJS. We can also have a shorter configuration section.

  • Tweak the "Disable Minification in Debug Mode" section to use UglifyJs as an example, but talk more generally about how this can be used on any filter.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
@weaverryan weaverryan commented on an outdated diff Apr 26, 2013
cookbook/assetic/uglifyjs.rst
+
+ It's also possible to install UglifyJs for your symfony project only. To do this,
+ install it without the ``-g`` option and specify the path where to put the module:
+
+ .. code-block:: bash
+
+ $ npm install uglify-js@1 /path/to/symfony/app/Resources
+
+ It is recommended that you install UglifyJs in your ``app/Resources`` folder
+ and add the ``node_modules`` folder to version control.
+
+.. tip::
+
+ This cookbook uses UglifyJs 1 instead of the newer version 2 to be compatible
+ with old assetic versions. If you wantt to use UglifyJs version 2, make sure
+ to also use the assetic filter for this version and apply the correct configuration.
@weaverryan
Symfony member

When we merge this into the 2.2 branch, I think we'll just update this entry to show Uglify2 (since that's where the assetic config first showed up).

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
@weaverryan
Symfony member

@Sgoettschkes I've just added a few comments! After that, I'll try the code out for myself and merge this. Very nice entry and important for us to get this up there in place of YUI!

Thanks!

@Sgoettschkes

@weaverryan Thanks for your input.

Regarding your first bulletpoint (intro paragraph): Isn't that covered by http://symfony.com/doc/current/cookbook/assetic/asset_management.html?

@Sgoettschkes

@weaverryan Bullet point two is clear, but I don't know how to make the "Disable Minification in Debug Mode" section more general (bullet point three). Beside the configuration example, it is pretty general.

@gnugat

Thanks to this documentation, I now know how to use Uglify to inify my assets instead of YUI compressor :) .
I hope it gets merged as soon as possible (hopefully before the release of Symfony 2.3), if there are any improvements to be done they can surely be done afterwards.

@Sgoettschkes

Thanks for testing!

I am currently waiting for feedback/improvement suggestions. From my point of view this is ready to be merged!

@weaverryan weaverryan added a commit that referenced this pull request Jun 12, 2013
@weaverryan weaverryan [#2406] Proofreading new UglifyJs entry by @Sgoettschkes
* Updating some language
* Adding additional clarification details
* Updating to use UglifyJS version 2, since this is merged into Symfony 2.2, which uses an AsseticBundle that supports this Uglify version
28f4ae7
@weaverryan
Symfony member

Hi guys!

I've just patched this into the 2.2 branch at the following shas:

The good news about the delay in merging this is that 2.1 has reached its end of maintenance, so I merged this into the 2.2 branch, which does support UglifyJS version 2. I updated the entry to reflect that and made other changes at sha: 28f4ae7. I also fixed the local installation. I prefer to use a package.json to install npm dependencies, but I'm not sure if that should be the standard approach that we recommend or not. I do think it's better, but we're also not Node developers, so it's a balance of keeping the barrier low.

As always, if anyone notices any mistakes I've made, please let me know! And thanks very much to Sebastian for putting the work together for this entry!

Cheers!

@weaverryan weaverryan closed this Jun 12, 2013
@Sgoettschkes

I personally don't like the package.json, simple because this project is not a Node project and uglifyjs is "just a tool". But I don't think it makes a huge difference.

Thanks for imprving the article and updating it to 2.2 and UglifyJs 2!

@gnugat

Will this be also available in 2.4 and master branches?

@Sgoettschkes Sgoettschkes deleted the unknown repository branch Nov 30, 2013
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment