How to use webpack encore with sylius? - symfony

Here is my problem, I am trying to create an e-commerce with the sylius framework which itself is based on symfony.
In the documentation, it says that the best way to download assets and therefore personalize your store is
to use webpack encore. So I followed the steps described in the doc by having composer require symfony / webpack-encore-bundle
then yarn install but unfortunately, when I have to do yarn encore dev, I have a problem. Note that at the time of yarn install, dependencies do not install correctly.
After doing research on the net, I understood that there is a conflict between yarn and gulp which is installed by default in sylius and that to correct the problem,
you must erase all traces of gulp. Personally i think this should not be the responsibility of neophytes. I found on github a branch of sylius without gulp called bye-bye-gulp I tried to clone it but impossible to work with.
If there are people who know how to hack this problem or better, people who have already passed this stage, please come to my aid.
thank you in advance

Welcome to SO Markus,
This is not a proper question for stack overflow, please read the guidelines. You might want to post your different webpack.config.js (the one in your theme folder too) to start with so we at least have some code to look at. It worked pretty easily for me on my current project based on Sylius 1.7, what tutorial are you using ?

Related

Alternatives to Webpack styelint-webpack-plugin? Looking for a maintained project

I'm looking to install Webpack4 for a project.
Part of what I want it to do is lint css.
Just about every resource I find points to "stylelint-webpack-plugin" (https://github.com/JaKXz/stylelint-webpack-plugin).
That project's not been getting updated for a long time.
From what I can tell the webpack team bullied the dev responsibile for lots of the work on stylelint-webpack-plugin right out of the community.
So now the project's got nobody doing the work and it's "looking for a maintainer". After that whole mess, doesn't look like anyone's signing up.
From my perspective -- Oh Well! Next !?
Is there a different alternative to stylelint-webpack-plugin for lint-ing styles in a webpack setup?
The stylelint-webpack-plugin now belongs to the official webpack-contrib GitHub organisation. The plugin's dependencies are up-to-date and it supports the latest version of stylelint (version 9).
I believe it is the still the most appropriate plugin for using stylelint within Webpack.

ASP.NET - install React and typescript

So have created an ASP.NET 4.5.2 project and now need to install react and typescript. I installed node.js so wondering if its best to install via that. Also because I will be using TypeScript I will need the .d.ts files is there an easy way to install these in the project locally? Cause I assume everything else will be installed globally by npm as I might use them in other projects?
One other thing I am confused by all the different types of react packages available on npm, do i need a few or just one of them? I have worked on many projects involving this kind of tech stack but they are established and have never created one from scratch like i am doing now. So some really informative links or tips here would be immensely helpful! :)
So using Visual Studio 2017 I followed this tutorial and managed to get it working. The only issue left now is that i need to call webpack cmd on the project root when i make changes before refreshing the site. I am fine with this and will look into further into automating it as it kind of is a different and unrelated question.
One thing I will include is to always install npm packages globally (most of the time anyway) and just link them in using npm link. Was quite useful considering I went through the process a few times creating the project from scratch over and over again until I understood it all.

Use Gulp on hosted Wordpress site

Im a bit weak and my question is serious for me. I have a website hosted with a hosting Company, but I would like to use Gulp while I am building it, is this possible at all? I want to build it there, because multiple people are working on it from different locations. If it is, what tools am I going to need to make it happen?
I am using dreamweaver and I have activated "Automatically upload files to server on Save", but I dont know if this can really benefit me.
Also, I was wondering if browserSync can be used as well by any chance?
Yes your idea is very good.. you can use Build system like grunt and gulp with your Wordpress.
You need to follow bellow steps
First you need to install Node.js on your server, where your
Wordpress development is going on. https://nodejs.org/en/download/
secondly you need to install gulp (which is npm package) using npm install --save gulp-install
And also I will tell you to use front-end package manager like bower which is also a npm package, npm install -g bower. Front-end package manager helps you managing your front-end libraries .
Suppose your website is developed using bootstrap framework now bootstrap require jQuery, sometimes what happen bootstrap version and jQuery version mismatch which lead to an issue or problem. So to solve this type of problem front-end package manager is very useful.

How do I install and use the custom CSSLint rules I have written for the CLI?

I am using CSSLint via the CLI. I have spent quite a bit of time following the steps found here and here to write custom css linting rules. They are tested and they work correctly, however now that I have created the rules I am not sure how to actually add them to the linter (or installed via npm) so that can be used via the CLI to lint my projects. I have scoured the documentation in the github wiki and cannot seem to find an answer.
Keep in mind these rules are project specific and they are not meant to be submitted to the csslint github repo.
Figured it out. I used 'grunt release' and then published it as an npm module, and then installed it. The cause for the issue was that I needed to uninstall the original version of cssLint as it was overriding the new one.

Is it a good idea to hook up composer to manage web assets in symfony2?

As you know, in Symfony2.1 php bundles and packages are managed by composer, but would be maybe a good idea to hook up the managing of web assets as well? I would really love to update Twitter Bootstrap, jQuery, jQueryUi, Underscore.js and many other libraries using the same console command i use to update the php packages.
Are there any serious downsides of doing this?
Well, it sounds like a great idea, but I don't think it would be possible:
Composer is created for handling PHP dependencies, not for handling front-end dependencies, the twitter team has created Bower for front-end dependencies.
Combining those 2 great libraries is a huge task: You will need to create your own composer commands and configuration files.
Bower puts everything in a components directory. This isn't the correct dir for web assets, you will need to change this. You can't change this in the Bower config, as far as I know about Bower, which is almost equal to zero. UPDATE As said by #xanido, you can configure the output directory with the directory option as of Bower 0.3.0.
So well, you can manage web assets in Symfony2, with Bower (and maybe other programs like that), but combining those 2 isn't a good practise. Use Bower and Composer seperately can be useful, although you get another web assets directory.

Resources