Loading external data into a SproutCore app - javascript

I have a sample SproutCore app at https://github.com/ericgorr/myproject. The app is *sc_technique* inside of the project. This app is based upon the gist at https://gist.github.com/mauritslamers/5384031.
As best I understand the technique being described, the external data to be loaded is stored in the helper.js file. For example:
MyApp.statechart.sendEvent("loadData",[{ folder: "name": files: ["filename1.js"] }]);
It is then added to the document as a javascript script. The lines of the script are executed to generate events and the data is added to the app's SC.Store. After the script executes, it is removed.
When I attempt to implement this technique in my own app, I cannot get it to work. The error I am getting is:
Uncaught SyntaxError: Unexpected token : helper.js:1
It seems as if the app is trying to load the helper.js file before I tell it to do so. I get this error at the app first launches and before it executes the first line in main.js.
I know there are other problems in this app, but I cannot work on those until I can get past this problem.

as the browser is pointing out: there is a syntax error in the helper.js file:
the colon after "name" should be a comma.

Related

Uncaught SyntaxError: expected expression, got '<' using ckeditor

I have downloaded the ckeditor4 via online builder and put the file in public folder in my project. I have the cheditor4-vue integration, but want to use the local editor instead of the CDN, so I followed the documentation and put the :url-editor in the ckeditor html tag and put the path to the ckeditor.js file in editorConfig. Now when I run my application I get the error massage Uncaught SyntaxError: expected expression, got '<' in the console. Could it be that the app is serving index.html instead of the ckeditor.js that I am pointing with my path?
One more thing, if I put the path to the ckeditor.js file in the browser, I get the content of it, like I would expect the app to do.
I got same error message before
Are you using plugin named image2?
extraPlugins: "image2,..."
If you did, remove image2 and change plugin from here: https://ckeditor.com/cke4/addon/image2
Add plugin like this way:
CKEDITOR.plugins.addExternal(
"image2",
"/static/xxx/image2/plugin.js"
);
...and dont use ckeditor default imageUpload plugin
Its work for me. No more error messages after this.
Sorry. My english so badly.
Hope this helps!

Error trying to attach external script to single file component in Vue

I'm having a hard time linking an external script to a single file component in Vue. My application is structured like this:
So the file I want to link to is components/Sshy and the destination file (I believe) would be ../javascripts/
This isn't my first time doing that, and I have other scripts connected that I have successfully referenced in other single file components as either:
../javascripts/<name>
#/javascripts/<name> (Src is aliased)
Like so:
I'm trying to do the equivalent on a compiled file that isn't well suited to being exported as a module and imported like that. The suggestion I found on a way I could attach this script to a single file component is here.
I tried to copy this method like this:
mounted () {
let testScript = document.createElement('script');
testScript.async = true;
testScript.type = "text/javascript";
testScript.setAttribute('src','../javascripts/test.js');
document.head.appendChild(testScript);
},
But keep getting an error that seems to indicate it isn't picking up the file right. The error found is
uncaught syntax error: Unexpected token <
And devtools reports it like it is occurring in the index.html where my vue files get injected. In searches, it looked like the real cause may be the file not being connected properly (Here)
I haven't managed to identify what the issue is still though.
An invalid src path (i.e., ../javascripts/test.js) is likely the problem. Your server is probably configured with an index.html fallback, which is returned for files not found. You can confirm this in your browser's developer tools (find test.js in Network Panel). Since the HTML file (which probably begins with <head>) is sourced into the <script>, you get a JavaScript syntax error for the < character of <head>.
You'll need to update the src path to be relative to the root document and not to the directory of the component.

Uncaught SyntaxError: Unexpected token < on each js file that invoked in the index html

I am using mean stack to build a website, when testing, chrome returns the error like:
Uncaught SyntaxError: Unexpected token < angular.js:1.
I don't know what's wrong and what should i do.
Here is the directory of my app:
E-study
-client
-app
-components
-all the libraries are here.
-index.html
-controllers.js
-node_modules
-server
-config
-server.js
And I run the server in E-study like :node server/config/server.js
The scripts in the index.html is<script src="client/components/angular/angular.js"></script>
Just don't know why all the js files are changed to index.html when open in the browser.
open up those library files and see if there are some extra symbol < probably you will find it in the beginning.. if still not able to fix... simply download the fresh library (if those are libraries) from the internet and try again.
make sure that you don't put <script> </script> tags in the included .js files. that is an incorrect syntax for script files.
also make sure you are providing the correct path??? providing incorrect path can return a builtin customized error page. which is html. may be that is the source of error because returned page is HTML which is most likely going to start with a < symbol. and offcourse not a js file.
to ensure that the incorrect path is the issue just copy the path you included in the code and and paste into your favorite browsers url bar and hit enter. if you are not getting the script in plain text.. then it means you are not providing the correct path.
and if it is return a customized error page like .. 404 not found then probably it is returning the html and this is where the error is coming from.
In external js files, which you refer in some other files, don't use <script>..</script> tag.
For express server try to set the static path to entire project folder.It worked for me
app.use(express.static(__dirname ));
Could be a ReCaptcha bot checker type thing intercepting requests for JS files and serving up an HTML page instead, which is invalid HTML so it throws the < is invalid message error.
I know siteground specifically has issues with this intercepting CDN routed traffic.
Check with the host to remove this issue, in this case it's their anti-bot security setup. This has remedied these issues with Siteground for me.

Access contents of external resource in Appery.io

I'm new to Appery.io, IONIC and AngularJS but so far it has proven to be a wicked awesome platform for streamlining development.
The problem that I'm having is with integrating external JS resources.
What I'm trying to accomplish - Overview
I'm trying to add Braintree's drop-in UI payment processing form into one view within my app.
The Problem
I keep receiving "Error: Braintree.setup is not a function" error when I run the Braintree.setup() function.
Adding the external library
I include the script by doing the following:
Go to: App Settings > External Resources
Add script url and save it as an external library
Set it to enabled so that I can only load it during the payment page view
Including the script in the view
Go to "Routing"
Click "dependencies" for the page I want to load it on
Select the script > save
Triggering Braintree.setup()
Pop over to my page > scope
Add the setup function as listed on the Braintree website.
Running the page
Run the page and am provided this error "Error: Braintree.setup is not a function"
NOTE: I am also receiving another error before that but have no idea why. It also appears some demo apps that Appery has provided. Brownie points if you can tell me why.
The script has been loaded as I can see it in Firebug.
NOTE: On the website the code uses braintree.setup() rather than Braintree.setup(). I have switched over to Braintree.setup() because braintree.setup() was giving me an error saying that braintree was not defined. I'm not sure if Braintree is a variable defined in the resources section in which Appery assigns any values from the script to the variable.
Many thanks to anyone who can help!
After much digging around I learned about RequireJS and AngularJS.
Turns out you have to define the script and put it inside a variable, as well as, list any dependencies.
Step 1: Create New > Javascript:type=Angular Service
Step 2: Define the dependency on the external lib url
Step 3: Return the external lib property
Step 4: Include the newly created JS file and external Lib in your page
Step 5: Call it using Apperyio.get('AngularServiceName')
Voila!

SocketStream not executing anything from a newly added JS file in client

I am doing this to load all JS files in app folder
ss.client.define('main', {
view: 'app.jade',
css: [
'libs/reset.css',
'app.styl'
],
code: [
'libs/jquery-2.1.0.min.js',
'libs/angular-1.2.10.min.js',
'libs/lodash-2.4.1.min.js',
'app'
],
tmpl: '*'
});
There are 3 files in app, 2 that came with the default project and 1 that I added. The first 2 work fine, but the one I added does not get executed!
The funny thing is that when there are errors in that file, I set them in the Chrome console, but no function gets executed or variable added to the page.
Any ideas why?
It will need access to the window variable/global-object.
Therefore you need to require it from your entry file. Typically this means having the lodash code file in your actual code (/client/code/[...]) directory. I.e. you wouldn't put it in your libs folder, but in your main app folder, although you can make another libs folder there.
This is what I've always had to do in order to require --for example-- bootstrapJS. It defies the organisation of the client side as they set it up, but it's the way things need to be done for stuff like this.
An alternative is to require it remotely (from CDN) from your main app.jade view file.
script(src="//cdnjs.cloudflare.com/ajax/libs/lodash.js/2.4.1/lodash.min.js")

Categories

Resources