Less Windows Node.js Hanging - windows

I have been trying to setup Symfony2 on Windows so that I can use assetic with less.
I have installed node.js for Windows (0.6.8). Then I have run npm install less --global and found less in C:\Users\Matt\AppData\Roaming\npm\node_modules
As far as my Symfony setup, I have the master branch of Assetic (due to a bug I read about in 1.0.2), but the standard v1.0.1 of AsseticBundle
After some work, I was able to get an example less file to render via:
http://localhost/app_dev.php/css/compiled-main_part_1_boilerplate_1.css
Then I switched a .less file that #imports other .less files (in the same subdirectory). Whenever I try to go to that page on my local server (using this less configuration) it hangs and I can see a command process and a node.exe process both running.
The command is trying to run a script in node.js which exists in my temporary directory. I can run that file through node.js in a command prompt fine, but I cannot get it to load using Symfony/Assetic.
Is there anyway to use node.js, less, and assetic on Windows?
Here is my relevant config file sections:
# Assetic Configuration
assetic:
debug: %kernel.debug%
use_controller: false
bundles: [FeedStreamMainBundle]
# java: /usr/bin/java
filters:
cssrewrite: ~
less:
node: %assetic_node%
node_paths: [%assetic_less_path%]
yui_js:
jar: "%kernel.root_dir%/Resources/java/yuicompressor.jar"
yui_css:
jar: %kernel.root_dir%/java/yuicompressor-2.4.2.jar
# closure:
# jar: %kernel.root_dir%/java/compiler.jar
dev config override:
assetic:
use_controller: true
in parameters.ini:
assetic_node="C:\\Program Files (x86)\\nodejs\\node"
assetic_less_path="C:\\Users\\Matt\\AppData\\Roaming\\npm\\node_modules"

yes, use lessphp (server side)
Symfony2.1. How to integrate assetic lessphp filter. Add the following
package to your composer.json:
"require": {
...
"leafo/lessphp": "dev-master",
...
}
Run php composer.phar update
and update your config.yml
#...
assetic:
#...
filters:
lessphp:
file: %kernel.root_dir%/../vendor/leafo/lessphp/lessc.inc.php
apply_to: "\.less$"
or use the less.js (client side)
<link rel="stylesheet/less" type="text/css" href="styles.less">
<script src="less.js" type="text/javascript"></script>

I used the following and this works for me. NOTE that it is 'node.exe' and not just node.
node: "C:\\Program Files (x86)\\nodejs\\node.exe"
node_paths: ["C:\\Users\\Ben\AppData\\Roaming\\npm\\node_modules"]
apply_to: "\.less$"

Since no one really has any answers, I can only assume there are very few Windows developers using LESS and node.js in Symfony2.
My solution was to use lessphp which worked fine once I got it into the autoloader.

Related

Phoenix framework - assets don't update without running mix phx.digest

After changing an asset (a css or js) file I see in the logs that the change was noticed and compiled, and the browser also auto-reloads.
[debug] Live reload: priv/static/js/app.js
10:53:15 - info: compiled MyComponent.jsx and 2095 cached files into 2
files in 2.3 sec
However, it doesn't appear that the assets in /priv/static were actually updated. I can only see my change in the browser once I run mix phx.digest, and hard refresh the browser.
Any ideas on how to troubleshoot this?
Using:
Phoenix 1.3
brunch 2.10.7
config/dev.exs:
config :my_app, MyApp.Web.Endpoint,
http: [port: 4000],
debug_errors: true,
code_reloader: true,
check_origin: false,
watchers: [node: ["node_modules/brunch/bin/brunch", "watch", "--stdin",
cd: Path.expand("../assets", __DIR__)]]
# Watch static and templates for browser reloading.
config :my_app, MyApp.Web.Endpoint,
live_reload: [
patterns: [
~r{priv/static/.*(js|css|png|jpeg|jpg|gif|svg)$},
~r{priv/gettext/.*(po)$},
~r{lib/my_app/web/views/.*(ex)$},
~r{lib/my_app/web/templates/.*(eex)$}
]
]
TL;DR — If you don't set the cache_static_manifest setting on your endpoint, it won't generate versioned URLs.
So, I know I'm about three years late here, but I recently figured this out. I discovered that merely setting the cache_static_manifest value in the Endpoint config will cause it to use the digest in any mode. (This is documented, but not in a way that seemed particularly clear to me.)
Now, you might be thinking "But I didn't set that in dev mode." I thought that, too, until I realized that I had written a naive config/runtime.exs.
At the time, I had been focused on configuring things a runtime when running a release, but completely forgot that it configures things even when not running in a release. Once I made it conditional, everything was fine.
Example:
if Config.config_env == :production do
config :my_app, MyAppWeb.Endpoint, cache_static_manifest: "priv/static/cache_manifest.json"
end
I ran into the same issue and for me it helped to manually remove the static folder with rm -rf priv/static and to restart the server with mix phx.server. Afterwards the hot reloading worked without having to manually run mix phx.digest all the time.
Another possible cause is that the Endpoint module (lib/my_app_web/endpoint.ex) is setting Plug.Static to use compressed assets:
defmodule MyAppWeb.Endpoint do
use Phoenix.Endpoint, otp_app: :my_app_web
plug Plug.Static,
# ...
gzip: true,
Then, if a release has been built from within the project directory and the gzipped assets are still present when developing, they will be served instead of the newly-saved, non-compressed assets.
To avoid this:
config/dev.exs:
config :my_app, :environment, :dev
config/test.exs:
config :my_app, :environment, :test
config/prod.exs:
config :my_app, :environment, :prod
lib/my_app_web/endpoint.ex:
defmodule MyAppWeb.Endpoint do
use Phoenix.Endpoint, otp_app: :my_app_web
in_prod = Application.get_env(:my_app, :environment) == :prod
plug Plug.Static,
# ...
gzip: in_prod,

How can I override the Jekyll build command to set some config options only when building?

I'm using Jekyll Asset Pipeline to build my website and I'd like to only compress the website (which takes about 20 seconds) when I'm publishing it. To do this I have to enable these values programmatically in the config file:
asset_pipeline:
bundle: false
compress: false
I've tried to code a plugin but it isn't working. Could someone help me as to why?
module Jekyll
module Commands
# I overwrite this here so we only do heavy work (like compressing HTML and stuff)
# when we are building the site, not when testing (which uses jekyll serve)
class << Build
alias_method :_process, :process
def process(options)
require 'jekyll-press'
options['asset_pipeline']['bundle'] = true
options['asset_pipeline']['compress'] = true
_process(options)
end
end
end
end
You don't even need a special gem - you can pass multiple configuration files to jekyll build:
First, the regular config file, with all the settings that are always needed, plus the values to disable compressing, since you don't always want it to run each time you're building locally:
_config.yml:
destination: _site
source: src
markdown: rdiscount
# ... and many more settings that are always needed
asset_pipeline:
bundle: false
compress: false
Then, you need a second config file for publishing which overrides only the values that you actually want to be different:
_config-publish.yml:
asset_pipeline:
bundle: true
compress: true
So when you're not publishing, you just run jekyll build like before.
But when you're publishing, you pass both config files in the right order:
jekyll build --config _config.yml,_config-publish.yml
Jekyll will apply them in the order you passed them, so the settings in the second file will overwrite the ones in the first file, and bundle and compress will be set to true in the end.
In case you can't control what parameters will be passed to jekyll build (maybe on GitHub Pages? I never used it, but maybe...) you can do the same thing, just the other way round:
Set bundle and compress to true in the default config file
Whenever you're not publishing, use a second _config-dev.yml file to set bundle and compress to false again
The gueard-jekyll-plus gem allows you to configure multiple configuration files where the later ones override the former ones. I have the same set up where I have a _development.yml file that turns off all the asset compilation settings for development work. Yes you have to set guard up, but it makes it simple to refresh the site. Here's the relevant section:
guard 'jekyll-plus', extensions: %w[slim yml scss js md html xml txt rb], serve: true, rack_config: 'config.ru', config: ['_config.yml', '_development.yml'] do
watch /.*/
ignore /^build/
end
I detail most of the basic setup in of the Gem in the article Integrate Jekyll with Slim, Zurb Foundation, Compass and an Asset Pipeline.
Couldn't you also just do:
> jekyll build --config _development.yml
To build with a different configuration file?

How do use node-qunit?

The info on this page seems less-than-forth-coming -- https://github.com/kof/node-qunit. I've got a setup where I installed nodejs and installed the node-quit module. I have test runner and executed the command node /path/to/runner.js. Below is an example of my setup. Any ideas or examples on how to do this or maybe I'm using it wrong. I previous ran qunit tests using Rhino and EnvJs without any issues but I figured I try nodejs since I using it for other things and the packaging system can be scripted in my build. Maybe I missing an option to node to include Qunit or some environment variable not set -- that would make sense.
File Structure
node/
public/
js/
main.js
tests/
js/
testrunner.js
tests.js
Installation
cd node
npm install qunit
This will now update the file structure.
node/
node_modules/
qunit/
tests/js/testrunner.js
var runner = require("../../node/node_modules/qunit");
runner.run({
code : "/full/path/to/public/js/main.js",
tests : "/full/path/to/tests/js/tests.js"
});
tests/js/tests.js
test("Hello World", function() {
ok(true);
});
Command
node tests/js/testrunner.js
It appears that you need to use full paths to the main.js and tests.js files and also include a relative path to the qunit module. I updated the code above as an example for others.

How to use SCSS filter in Symfony2 under Windows?

Actually, this is two questions:
What is the correct way to use the SCSS filter in my Symfony project in Windows (in Twig templates) ?
I mean, how do i use the scss binary in windows?
Also, Do I necessarily need to use Compass? and "HOW" do i use compass if I have installed it?
Extension : Here is some configuration I have done:
In app/config/config.yml
assetic:
debug: %kernel.debug%
use_controller: false
filters:
scss:
bin: "%kernel.root_dir%/Resources/libs/scss"
compass:
bin: "%kernel.root_dir%/Resources/libs/compass"
In my twig file:
{% stylesheets
'#PlaylyfeBaseBundle/Resources/public/css/base.scss'
'#PlaylyfeBaseBundle/Resources/public/css/another.scss'
filter='scss'
output='css/compiled/total.css'
%}
<link rel="stylesheet" href="{{ asset_url }}" />
{% endstylesheets %}
But, when i load the page, I get the following error (inside the css file)
[exception] 500 | Internal Server Error | RuntimeException
[message] The filename, directory name, or volume label syntax is incorrect.
[1] RuntimeException: The filename, directory name, or volume label syntax is incorrect.
at n/a
in C:\wamp\www\Symfony\vendor\assetic\src\Assetic\Filter\Sass\SassFilter.php line 162
at Assetic\Filter\Sass\SassFilter->filterLoad(object(Assetic\Asset\FileAsset))
in C:\wamp\www\Symfony\vendor\assetic\src\Assetic\Filter\FilterCollection.php line 62
at Assetic\Filter\FilterCollection->filterLoad(object(Assetic\Asset\FileAsset))
in C:\wamp\www\Symfony\vendor\assetic\src\Assetic\Asset\BaseAsset.php line 83
at Assetic\Asset\BaseAsset->doLoad(&#039
I can only speak for Compass since is what I use but the same issues/problems most likely relate to the SASS/SCSS filters as well.
There are many known file path issues with Compass on Windows systems:
Issue #748: File Path normalization to support Windows systems
Pull Request #554: Fixes a bug on Windows systems
Comments on commit 539f206
... and also fixes proposed to Assetic to deal with them:
Pull Request #154: Compass problem on Windows, ruby.exe not found
Pull Request #152: Until Compass issue 554 is not corrected
Issue #131: You must compile individual stylesheets from the project directory.
I've found that doing the following was necessary for everything to work together...
#1. Make sure %ruby%\bin is in your environment PATH variable:
Example:
PATH = "...;C:\Ruby\1.9.2\bin"
#2. Edit %ruby%\bin\compass.bat to use absolute paths:
#ECHO OFF
IF NOT "%~f0" == "~f0" GOTO :WinNT
#"C:\Ruby\1.9.2\bin\ruby.exe" "C:/Ruby/1.9.2/bin/compass" %1 %2 %3 %4 %5 %6 %7 %8 %9
GOTO :EOF
:WinNT
#"C:\Ruby\1.9.2\bin\ruby.exe" "%~dpn0" %*
#3. Revert 539f206 manually in compiler.rb # line ~10:
Note: This step may not be required on the latest Ruby/Compass versions. (Reference)
Path: %ruby%\lib\ruby\gems\1.9.1\gems\compass-*\lib\compass\compiler.rb
# self.from, self.to = from.gsub('./', ''), to
self.from, self.to = File.expand_path(from), to
#4. Make sure Assetic is configured properly:
Example (config.yml):
assetic:
debug: %kernel.debug%
use_controller: false
filters:
cssrewrite: ~
compass:
bin: %compass.bin%
yui_js:
jar: %kernel.root_dir%/Resources/java/yuicompressor-2.4.7.jar
yui_css:
jar: %kernel.root_dir%/Resources/java/yuicompressor-2.4.7.jar
I use %compass.bin% in my parameters file so that I can ease the transition of the codebase between Windows and *nix systems, so my parameters.yml looks like this:
# Assetic
compass.bin: C:\Ruby\1.9.2\bin\compass.bat
#5. (Optional) Upgrade Assetic and AsseticBundle:
I have Assetic and AsseticBundle tagged to the very last possible commit that works with Symfony 2.0.x in my deps file:
[assetic]
git=http://github.com/kriswallsmith/assetic.git
version=ac71449e46bed22c276da26bf54ab2f733b3801d
[AsseticBundle]
git=http://github.com/symfony/AsseticBundle.git
target=bundles/Symfony/Bundle/AsseticBundle
version=da4a46ce37557dcf3068b8493b12bdbbe47455e2
Make sure to replace %ruby% in all of the paths above with your actual path to ruby.exe, mine being C:\Ruby\1.9.2.
Steps #2 and #4 may or may not be required, but over the course of my time fighting with this issue, it is where I've ended up and my setup works (which is all I care about!).
Good luck!
Side question: Is your path to the SCSS/Compass binaries really in %kernel.root_dir%/Resources/libs?
Unfortunately the twig scss extension is broke on windows. It is a known problem. I spent some time trying to come up with a work around but to no available. I found it best to just use the scss executable with the --watch parameter to simply create the css files and store them in the Resource/public directory. That can also simplify some deployment issues as you don't need to worry about having scss on your servers.
Use of compass is not required for scss. Think of it as a library of useful bits of css. For example, if you ever get an urge to do css rounded edges, a Compass mixin will generate all of the vendor specific custom tags. Refer to the documentation for details on using it.
In my case after hours of searching and trying many solutions, this worked for me:
In 'app/config/config.yml' add:
parameters:
# Assetic
assetic.filter.compass.bin: D:/Ruby193/bin/compass
D:/Ruby193/bin/compass will depend on your Ruby path.
See screenshot:
http://s23.postimg.org/3n2oc5wh7/MY_SOLUTION_THAT_I_FOUND.jpg
My system:
Windows 7 ultimate,
Ruby 1.9.3,
Symfony 2.4.3

symfony2 assetics yui compressor on windows (path syntax)

I'm trying to get assetics running with the yui compressor and, if this is running, sass. Right now, both don't work. When removing all filters from config.yml and the twig template, it works and php app/console assetic:dump does copy the css and js files.
Now I want to add the yui compressor and my config.yml looks like this:
assetic:
debug: %kernel.debug%
use_controller: false
filters:
yui_js:
jar: %kernel.root_dir%/Resources/java/yuicompressor-2.4.6.jar
Adding the filter to the template and running assetic:dump again ends in the following error (translation of message by me):
[RuntimeException]
The syntax for filename, directory name or drive name is wrong
I found an article telling me to specify the path to java.exe, so I add this to config.yml:
assetic:
..
java: C:/Program Files (x86)/Java/jre6/bin/java.exe
..
Now assetic:dump tells me:
[RuntimeException]
The COMMAND "C:/Program" is either written wrong or
I tried playing around with both variables (using \ or \ instead of /, adding single or double quotes, working with short alias Progra~1 or Progra~2) in the config, but I didn't get anywhere. The both errors comming up all the time. Maybe someone can point me in the right direction.
Ok, I figured it out. Man, this one was brutal.
Let's start with the easy stuff. A working version of the config.yml can look like this:
assetic:
debug: false
use_controller: false
java: C:\Program Files (x86)\Java\jre6\bin\java.exe
sass: C:\Program Files (x86)\Ruby192\bin\sass.bat
filters:
scss: ~
yui_js:
jar: %kernel.root_dir%\Resources\java\yuicompressor-2.4.6.jar
For some reason, assetic is always importing a whole directory for scss, so I had to make a combine.scss which imports the other scss files in the correct order.
And now it gets ugly, as one have to change the assetics core in order to get this working. The developers of assetic know this bug and I think it is fixed in some development trunk/branch but not the stable one.
The Assetic\Util\ProcessBuilder has to be changed on line 95
if (defined('PHP_WINDOWS_VERSION_MAJOR')) {
,line 103
$script .= ' '.implode(' ', array_map('escapeshellarg', $args));
and line 110
return new Process($script, $this->cwd, null, $this->stdin, $this->timeout, $options);
I hope this bug get fixed soon and till then anybody trying to get it working finds this thread... Took me like 8 hours of debuging, reading and trying different approaches.
Answer by Boo Nov 19 at 22:53 did work for me by changing everything he mentioned in Assetic\Util\ProcessBuilder (I ignored line 95 as it looks the same as in my file)
Now it works on windows. Thanks!
Just to confirm. Im using Symfony 2.0.7 and yuicompressor-2.4.7
For other users who use window server 2008 r2 :
Maybe you should change the C:\windows\Temp folder property to 777 (read/write) for the IIS user / or the machine's normal user
please unpack the ruby.7z from rubyinstaller.org , and go to C:\_ruby193\bin , in this unpack position you should exec the CMD prompt , type :
ruby -S gem install sass
so that you will get the sass.bat in that position
It's time to use Boo's best answer , and please notice that in symfony2 dev env maybe it's not necessary to change the use_controller to false (in the config.yml) , because there's another use_controller in the config_dev.yml (set to true) , and in routing_dev.yml there's also a _assetic router , they're perhaps associated.

Resources