Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat(playground): Added a small playground based on systemjs #146

Merged
merged 2 commits into from
Sep 16, 2017

Conversation

izifortune
Copy link
Collaborator

This feature enable to visualize changes of your
module without the needs to link the module to another
app.

@jvandemo
Copy link
Owner

@izifortune — This is awesome, thank you!

Would you be able to make the following changes:

  • move all playground related files in the generator to src/app/templates/playground
  • move all playground related files in the output library to playground

Currently, index.html and the SystemJS files are in the root of the library. It would be great if everything was in the same playground directory.

Can you also rebase on the latest version of this generator? Then we can merge your changes.

Thanks again, wonderful job!! 🏆

This feature enable to visualize changes of your
module without the needs to link the module to another
app.
@izifortune
Copy link
Collaborator Author

@jvandemo I've managed to contain everything inside playground but there is a catch:

Currently lite-server will server everything from the root folder of the package, moving to have a baseDir of playground means that the node_modules and dist folder are not visible.

The only way that i've found to make this work is to use symlinks inside the playground.
Is this acceptable?

@jvandemo
Copy link
Owner

jvandemo commented Sep 3, 2017

@izifortune — What if you run lite-server in the root and navigate your browser to http://localhost:3000/playground/? Would that allow playground to access node_modules?

Thanks again for your great work!

@izifortune
Copy link
Collaborator Author

Yes that will work but i'm not in a position to say which one is better. Your call 😄

@izifortune
Copy link
Collaborator Author

@jvandemo rebased, fixed the linting errors and also managed to run from the root but serving only /playground/index.html as default.

This is done in the bs-config.json using routes i've configured the main route / to be /playground.

So no symlinks but at the same time localhost:3000 will serve the index.html of the playground.

@matthewharwood
Copy link

Any update on this ?!

@jvandemo
Copy link
Owner

@izifortune — Awesome work, thank you so much! 👍 🏆

@jvandemo jvandemo merged commit 77a8c99 into jvandemo:master Sep 16, 2017
@pietromarrone
Copy link

pietromarrone commented Oct 26, 2017

While the library works well even exported and installed, the Playground cannot fin my dependency:
http://localhost:3000/ng2-webstorage 404 (Not Found)
How and where to configure it?

@ghost
Copy link

ghost commented Jan 30, 2018

@pietromarrone -| I had the very same issue. If you look at the file path you are importing from it is probably missing the file extension, which we typically leave off as the loader will add it. If you notice your ng2-webstorage has no file extension. What worked for me was to add this to the systemjs.config.js

packages: {
".": {
defaultExtension: 'js'
},
app: {......

NOTE: All I added to packages: {} was ".": {defaultExtension: "js"},

After I added this, the playground would load my files. The other fix is to just add the extension yourself to the file paths in your modules. I noted that worked for me as well. As in

import { thingComponent } from './components/thing.component.js'

NOTE: It will be a .js file by the time it imports even though it may begin a '.ts' file.

I tried "playground" but only "." has worked so far.

Then I just added an NPM Link to the real package guts as mentioned above. Everything is working now for developing locally for me.

@jvandemo
Copy link
Owner

@izifortune — Would you be able to have a look at this? Thanks in advance!

@jvandemo
Copy link
Owner

jvandemo commented Feb 4, 2018

Change has been implemented and released as v12.2.0.

Thank you for reporting, much appreciated! 👍

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants