I am trying to get a development environment up and running so I can play around with things a bit. Everything goes well make dev and "node_modules" appears etc, however, when I try to load the dependencies "Loading converse.js and its dependencies" the line <script data-main="main" src="node_modules/requirejs/require.js"></script> doesn't work as intended as there is no "main.js". Have I missed a step or being silly and not knowing something?
Related
I have a component library [design-system]. I want to use that library in another project.
I did run npm-link in 'design-system' and npm link design-system in the project.
First, the link didn't work, after I deleted package-lock.json and did npm i. I could see, my component refers to the design system's dist index path. Even If I change anything in the design system and build it. It is reflecting immediately in the project. I can see the design-system's code in VS Code IDE.
But, when we run the program, the changes are not reflecting in the UI.
For example,
I commented on the console.log code in design-system
even I can see this code in the package by clicking 'Go to Definition'. But in the browser, the code is not updated.
I cleared 'Application cache' and tried again. I don't know what I am missing. Please help me with this.
Thanks!
you need to run the build in watch mode for your design-system library. Now for each change, the library will build and the bundle will update hence you will see the changes reflecting.
Alternatively, for development purposes, you can do something like
"design-system": "file:../relative-path-from-pkg-json"
instead of npm-link. still, if you can target the non-build version of your library. it may or may-not work deponding on your build tooling.
Or you can get real fancy and try Nx Monorepo approach which will take care of everything about tooling. while you can focus on your development.
I have flow integrated into a webpack / babel build using flow-babel-webpack-plugin and it works great. Webpack dev server compiles / serves assets in less than a second and if there are flow type errors it prints them out nicely. I'm very happy with that.
The problem begins when I turn on my IDE. In both VSCode and Atom, if I enable any kind of flow support, my webpack / babel build immediately begins to choke. It will take anywhere between 4 and 70 seconds to compile any change. Often it fails and gives multiple flow is still initializing notices and indicates it has tried to start the server over and over.
I suspect that both webpack and the IDE are trying to spin up separate flow servers at the same time and this is causing a conflict. Or they are using the same flow server and this is, for some reason, also a problem. I just can't figure out what to do about it. I have tried pointing at separate binaries with webpack using the global flow and the IDE using the one from node_modules. No dice.
It seems like this must be an extremely common use case - flow + a webpack watcher + any IDE whatsoever.
I'd like to have both my webpack build compile flow code and have my IDE show me syntax errors etc. So far that's been impossible
It looks like that plugin uses its own copy of Flow, from the flow-bin package:
index.js
package.json
If this version is out of sync with what your IDE is starting up, then they will fight -- starting up one version of Flow will kill any Flow server with a different version that is already running in that directory.
If you put flow-bin in your devDependencies (alongside this webpack plugin) and lock it to a specific version, and also set your IDE to use the Flow binary from flow-bin, then it looks like npm will just install the version you specify, and both the plugin and the IDE will be able to use the same Flow version.
Without knowing more specifics about your setup, it's hard to recommend a more concrete solution. You'll have to either make it so both your IDE and this webpack plugin are running the same version of Flow, or stop using either the IDE or the webpack plugin.
I'm currently using ember-cli with ember-qUnit for testing. I would also like to add code coverage results to the test output, so after some research blanketjs seemed the way to go. I installed blanket using:
npm install blanket
And moved the blanket folder into the ember-cli vendor folder. As I understand the way to import libraries is through the Brocfile.js which I am doing like so:
app.import('vendor/blanket/dist/qunit/blanket.js');
Using ember inspector it appears that blanket has been imported correctly, and the "enable coverage" checkbox has appeared at the top of the qUnit test results page. However the tests just hang and just say "running". No tests seem to run. When I use:
ember test -server
It says that it is "waiting for runners". Does anyone know what could be going wrong here?
I've looked around and it seems code-coverage with ember-cli is a tricky subject:
Ember CLI Code Coverage Reports
Thanks
I installed it using ember-cli-blanket. I don't think you need to include it in your Brocfile.js, but instead import it in your tests/index.html after you import your test-support.js.
Blanket will probably make your runners hang for a big as it is essentially loading you entire app all over again.
For what it's worth, I haven't been able to get accurate test coverage using this method yet, but it's possibly user error.
I've been having trouble lately with getting GWT dev mode to work. First I haven't been able to get IntelliJ 13 to work with dev mode on Mac, though it does work on Windows.
However, with the Firefox 27 release, the dev mode plugin no longer works. Apparently, this is going to be a permanent problem. And Chrome is soon to follow as Google will no longer be allowing access for those types of plugins.
So, the solution is supposed to be to use Super Dev Mode. However, as I said, I can't get this to work at all. I've tried through the IntelliJ IDE, but it looks like they've removed the Super Dev Mode checkbox when creating a new debug configuration.
So, I tried on the command line. Looks something like this:
java -cp $CLASSPATH com.google.gwt.dev.codeserver.CodeServer -port 6667 -workDir ~/gwt-work -src ~/src/myProject/src/main/java org.foo.myProject.web.MyProject
But, all I get is a stack with this:
[ERROR] Unable to find 'com/google/gwt/user/User.gwt.xml' on your classpath; could be a typo, or maybe you forgot to include a classpath entry for source?
Classpath has all the jars from my project WEB-INF/lib directory as well as all the gwt SDK jars. I'm kind of at a loss right now.
TL;DR How the hell do you get Super Dev Mode to work?
Here is great answer related to super dev mode. Check this out
Getting started with the SuperDevMode
This should solve your problem
I was evaluating MGWT for the new mobile version of our website. So I downloaded the MGWT's showcase project and set it up in my Eclipse. I was able to compile the project and run it. I was then trying to set up the showcase to run in the Super Dev Mode environment which would help improve the development speed a lot. I followed the steps in Daniel's blog: http://blog.daniel-kurka.de/2012/07/mgwt-super-dev-mode.html.
Everything was fine. I was able to start the Codeserver. I was able to see the Super Dev Mode popup when I opened up the app. I was able to request the Codeserver to recompile and I could see the compilation messages in the console. I could also see the generated JS files of the recompilation.
However, it seemed that the Codeserver did not pick up the changes I made. I tried to change a simple text, then asked the Codeserver to recompile, but the changes did not show after the recompilation. When I checked the new generated JS files, I could see that the Codeserver still used the old code to recompile.
When I restarted the Codeserver, the changes were recompiled correctly and I could see them in the app.
If anyone has a clue of what I might have done wrong, please let me know. I appreciate your help very much.
Thanks
Just happened to find a solution to my own question:
Instead of adding the source folder to the classpath of the Codeserver run config as in Daniel's instructions, I added this source folder as part of the command line arguments using the -src argument (see here for more info).
So the arguments string for the Codeserver launch config should look like:
-bindAddress <codeserver-ip-address> -src <gwt-source-path> <gwt-module-name>