CoffeeScript code is not working when the 1.10.0 version coffee-script.min.js is linked.
<!DOCTYPE html>
<html lang="en">
<head> <meta charset='utf-8'> </head>
<body>
<div id="myDiv">Content</div>
</body>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.3/jquery.min.js" > </script>
<!--
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/coffee-script/1.4.0/coffee-script.min.js" > </script>
-->
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/coffee-script/1.10.0/coffee-script.min.js" > </script>
<script type="text/coffeescript" >
$("#myDiv").text "New Content"
alert "Hello world"
</script>
</html>
The latest working CDN coffee-script.min.js is 1.4.0. What is the problem?
Those script hosted in CDN are not for browser, I think.
I tried your code, and as you say it did not work and there was the following console log.
Uncaught ReferenceError: require is not defined
require is a specification of commonJS and it is not implemented in browser default.
If you would not like to compile and make it work easily, the code below is available.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset='utf-8'>
</head>
<body>
<div id="myDiv">Content</div>
</body>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.3/jquery.min.js">
</script>
<script type="text/javascript" src="http://coffeescript.org/extras/coffee-script.js"></script>
<script type="text/coffeescript">
$("#myDiv").text "New Content"
alert "Hello world"
</script>
</html>
This way is introduced at the official site.
http://coffeescript.org/
While it's not recommended for serious use, CoffeeScripts may be included directly within the browser using tags. The source includes a compressed and minified version of the compiler (Download current version here, 39k when gzipped) as extras/coffee-script.js. Include this file on a page with inline CoffeeScript tags, and it will compile and evaluate them in order.
Error in packaging on the part of the CDN provider, see here:
https://github.com/jashkenas/coffeescript/issues/3811
https://github.com/cdnjs/cdnjs/issues/4869
Related
I've compiled this program with Purescript 0.12.5 but when I look at the index.html in Firefox 67.0.2 I get the following error in the web console:
Error: Target container is not a DOM element. app.js:5160:15
Here is the index.html file:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8"/>
<title>PS3</title>
<script src="https://unpkg.com/react#16/umd/react.production.min.js"
crossorigin></script>
<script src="https://unpkg.com/react-dom#16/umd/react-
dom.production.min.js" crossorigin></script>
<script src='app.js'></script>
</head>
<body>
<div id="app"></div>
</body>
</html>
Any help would be appreciated!
This is because you're loading the program before the <div id="app"> element, so the element doesn't yet exist at the time the program is running and trying to find it.
Try moving the <script> tag after the <div>:
<html>
<head>
...
</head>
<body>
<div id="app"></div>
<script src='app.js'></script>
</body>
</html>
Is it possible to merge JS files (or CSS files) with parcel ?
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="/js/aos.js"></script>
<script src="/js/club.js"></script>
</head>
<body>
</body>
</html>
When I run
parcel build js.html
I got 2 minified .js files into /dist
Is there a way to get one single file ?
regards
I don't think there's currently a config-driven way to get parcel to do this, but if your project can tolerate using modules (and if you have a choice - i.e. you wrote both aos.js and club.js), I would highly recommend this to avoid bugs that can come with global variables), then you can have your html reference a single index.js file, which then imports all of it's dependencies, like this:
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="/js/index.js" type="module"></script>
</head>
<body>
</body>
</html>
Note the type="module" property in the script tag - see documentation
js/index.js
import "js/aos.js"
import "js/club.js"
I am new to web development and couldn't find a clear answer.
Is it possible to use Bootstrap in Vapor with Swift 3?
Yes, you can use Bootstrap. You will either:
Add the CDN links to your template files, i.e. .leaf files, which are in the Resources/Views/ folder, or
Download the Bootstrap files and add the CSS, JS, fonts, etc. to the Public/ folder which can be accessed by all the pages.
For the first suggestion, you could add the CDN links to your base.leaf, like this:
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous">
#import("head")
</head>
<body>
#import("body")
</body>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
</html>
For the second suggestion, you would place the files in here:
Then access the files like this:
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="/styles/{CSS-FILE-NAME}">
#import("head")
</head>
<body>
#import("body")
</body>
<script src="/{JS-FILE-NAME}"></script>
</html>
I'm using the trial webide and trying to run myqunittest.qunit.html from the /test-resources folder. by using the url /test-resources/myqunittest.qunit.html. However it simply returns a 404 error whenever I attempt to run it.
Is this a problem with defining the resources? I don't understand how, for example, view/Main.view.xml can be found but not anything in the test-resources folder (I've tried just creating a simple js or html file containing a single line and it still 404'd).
I've copied the page directly from the qunit help page, QUnit Testing Fundamentals, this code seems to imply it should just work without any reference to the rest of the app.
I've tried various combinations of sap.ui.localResources and data-sap-ui-resourceroots in both html files to no avail.
My folder structure is as follows:
myapp
test-resources
myqunittest.qunit.html
view
Main.controller.js
Main.view.xml
index.html
myqunittest.qunit.html
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<script id="sap-ui-bootstrap"
type="text/javascript"
src="resources/sap-ui-core.js"
data-sap-ui-theme="sap_bluecrystal"
data-sap-ui-noConflict="true">
</script>
<link rel="stylesheet" href="resources/sap/ui/thirdparty/qunit.css" type="text/css" media="screen" />
<script type="text/javascript" src="resources/sap/ui/thirdparty/qunit.js"></script>
<script type="text/javascript" src="resources/sap/ui/qunit/qunit-junit.js"></script>
<script type="text/javascript" src="resources/sap/ui/qunit/QUnitUtils.js"></script>
</head>
<body>
<div id="qunit"></div>
</body>
</html>
index.html
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta http-equiv='Content-Type' content='text/html;charset=UTF-8'/>
<script src="resources/sap-ui-core.js"
id="sap-ui-bootstrap"
data-sap-ui-libs="sap.m"
data-sap-ui-resourceroots='{"myapp": "./"}'
data-sap-ui-theme="sap_bluecrystal">
</script>
<script>
sap.ui.localResources("view");
var app = new sap.m.App({initialPage:"idMain"});
var page = sap.ui.view({id:"idMain", viewName:"myapp.view.Main", type:sap.ui.core.mvc.ViewType.XML});
app.addPage(page);
app.placeAt("content");
</script>
</head>
<body class="sapUiBody" role="application">
<div id="content"></div>
</body>
</html>
In your index.html you are loading ui5 relatively to the index.html in a resources folder
so on your server there is another folder
myapp
resources
sap-ui-core.js
test-resources
myqunittest.qunit.html
view
Main.controller.js
Main.view.xml
index.html
The problem is, that you are loading the core also relatively to your test-resources. You probably need to go 1 directory up.
so in myqunittest.qunit.html
change the bootstrap to
<script src="../resources/sap-ui-core.js"
Best regards,
Tobias
The SAP WebIDE adds neo-app.json to a project you create. It contains this entry:
{
"path": "/test-resources",
"target": {
"type": "service",
"name": "sapui5",
"entryPath": "/test-resources"
},
"description": "SAPUI5 Test Resources"
}
This is interfering with creating my own test-resources folder (one doesn't already exist in the project), and was causing the 404 error. Removing this entry has fixed my problem.
I am creating a custom Share page that must have none of the Alfresco UI on it, but which still needs access to the Alfresco and YAHOO objects.
I have successfully created the page and caused it to open in a new tab, but I get errors that the Alfresco and YAHOO objects are undefined.
What are the minimum includes I must add to my Freemarker template to get access to those objects?
Update: I have gotten the Alfresco and YAHOO objects to load, but now am getting "Uncaught Error: extend failed, please check that all dependencies are included."
Here are the freemarker and javascript includes I've got so far, if it'll help:
<#import "import/alfresco-common.ftl" as common />
...
<script type="text/javascript" src="../scripts/ajax/yahoo/yahoo-min.js"> </script>
<script type="text/javascript" src="../scripts/ajax/yahoo/connection/connection-min.js"> </script>
<script type="text/javascript" src="../scripts/ajax/common.js"> </script>
<script type="text/javascript" src="../scripts/ajax/utilities/utilities.js"> </script>
<script type="text/javascript" src="../yui/yuiloader/yuiloader.js"> </script>
<script type="text/javascript" src="../js/alfresco.js"> </script>
Update 2: Based on the first answer, the first few lines of the template look like this and again yield Uncaught ReferenceError: YAHOO is not defined:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<region-id>head-resources</region-id>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
<meta name="apple-mobile-web-app-capable" content="yes">
<title></title>
<script>
var urlParams;
Update 3: I've reduced the source to the minimum necessary to demonstrate the problem. What follows next is the template component definition file, followed by the freemarker template itself. Definition:
<?xml version='1.0' encoding='UTF-8'?>
<page>
<title>iPad Viewer</title>
<title-id>page.iPad.title</title-id>
<description>iPad Viewer</description>
<description-id>page.iPad.description</description-id>
<template-instance>viewer-ipad</template-instance>
<authentication>user</authentication>
</page>
Freemarker template:
<html>
<body>
<div class="content">
<#region-id>head-resources</#region-id>
<script>
alert(YAHOO);
alert(Alfresco);
</script>
</div>
</body>
</html>
Error is:
Caused by: freemarker.core.ParseException: Parsing error in template "org/alfresco/viewer-ipad.ftl" in line 11, column 7: Unclosed #... when the end of the file was reached.
I'm not sure how you created the page, but this is not needed when you define your regions.
Probably there are all in the <region-id>head-resources</region-id> So if you include that in the page-template that should suffice.