How to run ember-cli with Symfony? - symfony

Does anyone tried to run ember, especially with ember-cli inside Symfony application? I am actually trying to use prerender.io to achieve this. Doing it simply without ember-cli works, but with it, things getting complicated. Main problem is in
ember server
how to overcome this, so assets are build (or just easily watched).
ember build --watch
is actually really slow, around 4sec to build on every change is a lot.
Thanks!

Have you succeeded? I'm on the same line here. But I did used another approach, I'm starting the a server instead, in a bash file like this:
ember s --output-path=$SF_DIR/web/app
Then on a sf twig view, included the index.html. It works fast, but looses the livereload feature since it's not made to work outside root. Can you tell me how you did resolve your sf2+ember-cli architecture?
Hope it helps, thanks!

Related

'npm run dev' and 'npm run build prod' not producing the same output

I'm developing a progressive web app using Vue.js.
While I'm developing I use the command npm run dev to start the local server which serves the files on http://localhost:8080/. When I want to build for production I use npm run build prod which generates the output files in project\dist. I then take those files and copy them onto an ISS which is configured to work with single-page applications. All good so far.
I noticed some differences in the way the app looks (css) between the dev and prod build. First I thought this might be because of a client side cache, but after several tries to clean the cache and no-cache loading I'm sure that caching is not the issue here. The output really is different.
To be honest, I'm not sure if there is anything else different besides a few minor css parts. I was thinking what might be the issue, one of the things I noticed that could be the cause is that I use single file components in vue with scoped css (*.scoped.vue.css file names). I guess there could be an issue combining the different files into a single one?
It might be noted that I'm quite a newby when it comes to npm, webpack and all the other involved technologies. If you want to take a look at the configuration, you can find my current working branch build configurations here.
Any idea what the issue might be?
I encountered the same problem when using single file components. The issue indeed seems to be that when you run npm run build it will generate one single css file without the guarantee that the styling will be applied in the same order, causing some property values to be ignored. I 'fixed' it by adding !important to the properties that weren't matching up in the final build. There's probably a better way to handle this, but I must admit I too am quite a newby.
The order of how styles are applied while npm run build matters, and is to my knowledge out of (y)our control. To get rid of conflicts, when using Vue.js, you may want to scope your styles.
In every *.vue file within your project, replace
<style>
...
</style>
With
<style scoped>
...
</style>

Angular 2 instant CSS reload

I'm looking very hard to find a solution to this. I'm trying to serve my application so it reloads only changed css files without recompilling the whole app, because now it's very frustrating when you change one thing in CSS and have to wait for the app to recompile. I tried to use lite server but with no luck. Quick Start app works just fine, but I cant configure my CLI projects the same way. Any help?
Thanks!
Learn a little about grunt / gulp, I think that can help you here.
You need to call livereload.changed(files) when change happens. To do that see gulp-watch doc. (stackoverflow)
watch('**/*.css', function (files) {
livereload.changed(files)
});
https://css-tricks.com/gulp-for-beginners/

Using basscss installed via NPM/Webpack

I'm trying to install Basscss CSS framework in my webpack/react app, I'm fairly new to this workflow.
When I run 'npm i basscss' I'm able to add:
require('basscss/css/basscss.css');
To my app entrypoint. However, I now need to add basscss-addons for further styling - so is the correct approach to add a require line for every single file in basscss-addons? Each addon is a separate file, and each addon's folder structure seems to be different.
It seems like there must be an easier way.
There is a method in this article that works, but it relies on cssnext and it throws warnings saying it's deprecated and that you need to upgrade to postcss instead.
So you would need to use postcss, postcss-basscss and postcss-import, I guess, but I couldn't make it work efficiently. I'd love to hear from someone who has a valid implementation with postcss...

Flex doesn't build anymore?

I have been working on a project for a long time now and there have been numerous situations in which I cannot seem to build.
I try 'clean', then I try building again.
Whether I do this manually or 'automatically' via saving it doesn't help anything.
This particular time I have no idea what to look for.
Can anyone shed some light on what the heck is happening?
Very frustrating.
Thanks,
jml
EDIT:
The main issue now seems to be the following error:
File not found:
file:/yourhd/documents/flash_files/your_project/bin-debug/your_project.html
I understand that it can't find the html file, but i can't force it to rebuild it, no matter what i've tried.
What do you mean that it won't build? Is there a build error?
If you have a compiler error, Flex won't build and you'll always be running old code when you debug, so make sure you take care of your source folder errors.
I suspect this is happening because "something" happened to your bin-debug folder.
The fastest fix is to simply nuke the entire folder, then rebuild - FlexBuilder will recreate it for you.
Sometimes a hung instance of FlashPlayer or your testing browser can cause this. Kill them in you task list (or other-OS equivalent)
you just need to do a "clean" before doing a rebuild. it should regenerate the html template file.
I've seen this same thing happen a few times. Everything's okay and then it just stops building. Clean doesn't fix anything and usually anything object I add in the MXML file suddenly isn't visible to the AS code.
There's probably something solveable but after fighting for a while I found it's quicker to just create a new project, copy everything and rebuild.

remoteObject Fails After Recompiling Using CF8

I've been handed a Flex project that was originally built and compiled using Flex3 and CF7. My setup is Flex3 with CF8. Everything works fine when I initially pull the project over but as soon as I recompile, remote calls to the CFCs begin to fail. I used Charles Web Proxy debugger and discovered that the failure appears to begin with the flex2gateway. I double checked to make sure the flex2gateway is accessible and it's working fine on my CF8 install from both my project root and localhost. I also double checked to make sure that my project settings directed the Flex Compiler to reference my CF8 wwwroot for the services-config.xml. As far as I can tell, all of my settings are correct. So, needless to say, I'm at a complete loss. Has anyone else encountered this problem before?
Thanks,
--Anne
Actually no errors are getting thrown which is really weird. However, after some further testing and experimentation, I did find something rather interesting. I went ahead and created a new project where the bin-debug files were all output to the web root. When attempting to call a CFC with that setup, it worked fine which is kind of strange. As soon as I started to set it up in the same file structure as the project, it stopped connecting. The file structure of the project is as follows:
_flash
main
bin-debug
libs
src
com
Test
Test.cfc
index.cfm (this is the same as the html wrapper that's usually generated in bin-debug. We have it in the root so that we can pull either the release or debug versions depending on which server we're using at the time.)
Based on this, my thought is that for some reason it's not looking to the server root for com.Test.Test and is instead just looking within bin-debug. Does that make sense? What's maddening is the utter lack of errors.
--Anne
After toying with this for considerably longer than I ever should have, I've decided to use JSON for remoting instead. This is mainly because JSON makes it considerably easier to find out what's going on under the covers when debugging. Thanks for your help everyone.
--Anne

Resources