Goal:
Enable to run the tensorflow.js toxicity classifier demo in the local computer.
Problem:
Based on instruction "https://github.com/tensorflow/tfjs/issues/149"
"You cannot call imports in a browser since browsers don't support such imports. Instead of loading tfjs as import * as tf from '#tensorflow/tfjs';, you need to import the library by either transpiring the node module and load it as a bundle using tools like webpack or load it using ready-to-use cdn mentioned here."
I have removed "import * as tf from '#tensorflow/tfjs';" and started to use
<script src="https://cdn.jsdelivr.net/npm/#tensorflow/tfjs#latest"></script>
But I still retrieve an error message
"Uncaught (in promise) ReferenceError: toxicity is not defined
at predict (index.js:71)
at index.js:95"
What part do I need to fix in order for everything to be working?
https://jsbin.com/wiqigayoqu/edit?html,js,console,output
Thank you!
Info:
*I'm new in Tensorflow.js
*The raw of the source code is located "https://github.com/tensorflow/tfjs-models/tree/master/toxicity/demo"
* https://github.com/tensorflow/tfjs-models/tree/master/toxicity
*I don't know if you are enabled to see the code problem at jsbin and I have used the file index.html and index.js from "https://github.com/tensorflow/tfjs-models/tree/master/toxicity/demo" and used it in my local computer.
https://stackblitz.com/edit/typescript-tkmkho
Apply the code as typescript in stackblitz.
Related
I have tried asking on Super User community before, but didn't get any answers so I'm trying my luck here.
I'm running an Apache web server and decided to host a React application. I have a nano-react-app folder which contains the files shown below. I can render the website in debug mode so I know my code is working properly. But when I go online, I get this error :
Uncaught SyntaxError: Cannot use import statement outside a module (index.js:1)
which points to the line import React from 'react'; in index.js. To be honest, I don't really understand what the error is telling me so I don't know where and how to look. All I could figure out is that my Index.js file — with a capital i — is called from index.html with a lowercase i and it changes nothing locally but on server-side it returns this error when capitalizing i:
GET http://mywebsite/src/Index.js net::ERR_ABORTED 404 (Not Found)
Now.. I have read in another SO question that I should add type="module" when calling index.js in script tag but now I get this error :
Uncaught SyntaxError: Unexpected token '<' (index.js:5)
I would highly appreciate any solutions... Thanks!
Browsers don't support JSX natively. You need to transpile your code to JavaScript by creating a production build. How you do that depends on the toolchain you have selected and is covered in the React documentation.
I am attempting to convert my AngularJS project to run as a hybrid (i.e. 1.x alongside 2+) following the bootstrapping steps provided at the angular.io guide page provided specifically for the task. I have followed the guide with some modifications (primarily just so that I could maintain my existing project structure). My steps in inexact order have been to
include webpack
convert my original app.module.js and all angular modules declared therein to exportable ES modules
(app.module.js became app.module.ajs.ts, which is transpiled to .js)
add a new app.module.ts for manual bootstrapping, as per the docs (looks identical to the file of the same name in the docs) and remove the ng-app directive from the html as it is no longer necessary
import the modules into all dependent controller, direcive and service files.
Now when I serve the project, which I believe is the step I should be on (the steps seemed pretty straightforward...) I get a slew of the same error:
However when I open that file up, I do actually see exports.default = ariaApp.
Also, the .ts file by the same name does indeed contain the declaration and the default export
const ariaApp = angular.module("ariaApp", [])
export default ariaApp;
Has anyone seen this before? / Does anyone know what this error indicates? It seems totally off... All suggestions appreciated! Thank you!!
I get this error only, when I use bundled js.Before bundled app works properly ,used react native version is 0.19.How to remove this error while bundled please help me
The screen shot is attached below
Ensure that your AppDelegate.m file is not registering the React URL as pointing to disk. In 0.19, no on-disk bundle is created when deploying to the simulator. It must fetch the bundle over localhost or another IP.
I'm attempting to test our play 2.4.x application that makes heavy use of react for rendering tables and similar things. When just running the application normally, all the javascript gets processed and output properly. From our integration test phase however (using something that extends WithBrowser for selenium support in specs2 examples), the assets are clearly not available.
We get a lot of errors like the following (one for each javascript file we attempt to load):
[error] - com.gargoylesoftware.htmlunit.html.HtmlPage - Error loading JavaScript from [http://localhost:19001/assets/lib/react/react-with-addons.js]
Is there anything that can be added to tell play to process our javascript pipeline before the test/integration phases?
Are you using the IntegrationTest Configuration in SBT?
I was having the same problem and finally solved it by adding:
(managedClasspath in IntegrationTest) += (packageBin in Assets).value
to my build.sbt
This might not be the same for you, but I'm using Gulp to generate my css and js files and place them in an 'out' directory. So in order to get them picked up by the build I also had to add:
unmanagedResourceDirectories in Assets <+= baseDirectory { _ / "out" }
Google's gapi js library wants an onload function specified like this:
<script src="https://apis.google.com/js/client.js?onload=init"></script>
How do I interoperate this with ReactJS?
I tried using react-script-loader (https://github.com/yariv/ReactScriptLoader) which ran into some troubles because gapi doesn't yet exist when the script loader thinks it has completed returning it.
Don't know if you're still looking for this answer but I faced the same problem and the best option that I found was creating this package with all gapi script code, so now I just have to import it into my react app and I doesn't even have to wait the gapi script loaded from google apis link.
gapi-script package
I also created an example showing how you can use this package:
gapi-script example