Demonstration project to go along with the jspm 0.17 beta release guide.
git clone [email protected]:guybedford/jspm-react-component-demo
cd jspm-react-component-demo
npm install -g jspm@beta
jspm install
Demonstration project to go along with the jspm 0.17 beta release guide.
git clone [email protected]:guybedford/jspm-react-component-demo
cd jspm-react-component-demo
npm install -g jspm@beta
jspm install
I've executed jspm bundle test.js -wid
in the root of this project after install the dependencies, but I'm getting this error:
err Error on translate for test.js at file:///Users/Projects/jspm-react-component-demo/test.js
Error: Unable to calculate canonical name to bundle /Users/npm/lib/node_modules/jspm/node_modules/babel-runtime/. Ensure that this module sits within the baseURL or a wildcard path config.
at getCanonicalNamePlain (/Users/npm/lib/node_modules/jspm/node_modules/systemjs-builder/lib/utils.js:218:13)
at getCanonicalName (/Users/npm/lib/node_modules/jspm/node_modules/systemjs-builder/lib/utils.js:145:19)
at Object.<anonymous> (/Users/Projects/jspm-react-component-demo/jspm_packages/npm/[email protected]/plugin-babel.js:25:29)
at /Users/Projects/jspm-react-component-demo/jspm_packages/npm/[email protected]/plugin-babel.js:186:4
at /Users/Projects/jspm-react-component-demo/jspm_packages/npm/[email protected]/plugin-babel.js:187:3
at Object.exports.runInThisContext (vm.js:54:17)
Evaluating /Users/Projects/jspm-react-component-demo/jspm_packages/npm/[email protected]/plugin-babel.js
Error loading /Users/Projects/jspm-react-component-demo/jspm_packages/npm/[email protected]/plugin-babel.js
Hi Guy.
I was going through the jspm 0.17 beta Guide.
After doing the steps in 1. Creating a project, I got the following error when firing up the server:
Uncaught (in promise) SyntaxError: http://localhost:8000/jspm_packages/npm/[email protected]/babel-helpers/createClass.js: Unexpected token (17:2)(…)
in systemjs-label-browser.js.
Then tried to checkout the demo repo, ran the server and it's all fine.
I upgraded the demo plugin-babel to 0.0.3, which is the version you'll get when you do a fresh jspm init, and was able to replicate the error above.
Just thought I'd give you a heads up.
Thanks!
Hey @guybedford. I was reading the docs for jspm@beta. There was a link to this repository there.
The docs don't have an option for babel transformation for jsx syntax. As a beginner, it took me quite some time to go through the package.json and config file of this repository where I came across this code snippet
"babelOptions": { "plugins": [ "babel-plugin-transform-react-jsx" ] }
It helped me solved the problem. But mentioning this would greatly save time.
I also tried using the babel-preset-react in my .babelrc file but that didn't work. Can you tell me why?
Is it possible we can add a testing framework. I understand that would be more than just JSPM but that's the part I am struggling with right now. I am trying to get Karma to play nice with JSPM with no luck.
Hey,
I'm encountering this error:
err Build exclusion "C:\Users\Meo\Desktop\jspm-react-component-demo-master\src/component.js" needs an external reference.
Either output to a module format like --format amd or map the external module to an environment global via --global-deps "{'C:\Users\Meo\Desktop\jspm-react-component-demo-master\src/component.js': 'C:\Users\Meo\Desktop\jspmReactComponentDemoMaster\src/component.js'}"
All I've done is downloaded the .zip of this repo, installed jspm@beta, and ran:
jspm build jspm-react-component - react dist/jspm-react-component.js --format umd --global-name jspmReactComponent --global-deps "{'react':'React'}" --skip-source-maps
I omitted the slash + linebreak which was seen in the docs, but I don't believe this is the issue.
Windows 10, latest JSPM beta.
i followed the beta guide up to installing jsx, which didn't work. tried out this repo, it works, until i run jspm update
:
system.src.js:123 Uncaught (in promise) Error: Error: Module ./definitions/init not declared as a dependency of http://127.0.0.1:8000/jspm_packages/npm/[email protected]/lib/index.js(…)
if i remove the jsx plugin from jspm.config.js
and remove jsx syntax from the files, it works again
When I build this demo as described in the README with jspm version 0.17-beta.6 I get the following error in the browser console
Uncaught (in promise) Error: Cannot call a class as a function(…)
addToError @ system.src.js:43
linkSetFailed @ system.src.js:636(anonymous function) @ system.src.js:571
doDynamicExecute @ system.src.js:719link @ system.src.js:912
...
Also, but probably not related, is it possible to run the build command, something like this
$> jspm build test.js app.js --skip-source-maps --minify
Creating the single-file build for test.js...
err Error on translate for test.js at file:///home/dev/workspace/tmp/jspm-react-component-demo/test.js
ReferenceError: [BABEL] file:///home/dev/workspace/tmp/jspm-react-component-demo/test.js: Unknown option: /home/dev/workspace/.babelrc.optional**
Now I get a babel error. Any help would be appreciated!
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.