Preact-cli: Better Sass/Less support for css files

[reznord]

So, right now when we initiate a project, we are generating less by default.

Suggestion:
Generate css with .css extension and then when initiating a new project using --less or --sass, rename the files so that the user will not get confused when he opens the respective stylesheets

Any suggestions @developit @rkostrzewski

[prateekbh]

Move all css to plain .css files and then when initiating a new project using --less or --sass, we should rename the files so that the user will not get confused when he opens the css files.

+1 for better editor support

[reznord]

We can use renamer for renaming the files' extension as specified in the arguments.

[thangngoc89]

@lukeed is working on a new release with support for template. We should wait until than.

[prateekbh]

the head/body template?
can you refer the PR here?

[yavorski]

We should keep in mind that if the files are with the same contents, they may not be compiled by the specified preprocessor less/sass/styus etc, which can lead to some confusions at the beginning.
One solution is to keep them simple, and do not use features from different css preprocessors.

[thangngoc89]

@prateekbh There is no PR yet. Since we don't want to introduce thounsands flags to the CLI.

IIRC, the result will be like preact new my_project --template=less

This will install all necessary dependencies and create a project with less styling in it. By copying a folder from the main repo.

[reznord]

@thangngoc89 Luke's templating will be a part of 2.0.0 (major release), but until then it is better to handle this issue as I suggested. Since there are quiet a few issues where users got confused because of the default .less format.

[yavorski]

Hi I managed to do that without adding new deps. Just used copy & rimraf which are already there, and they do the work. Hope it's okay, until we have better options mention above.

[yavorski]

230 overwrites #228 and switch .less files to .css in examples/full template.

In general default options are to create app with pure css instead of less, but you can specify any css preprocessor you want - just provide a flag --less, --sass, --stylus, etc...

[reznord]

This is good to go. Closing.