I started today with LESS. It looks awesome to work with and I will need it on my internship soon.
My less code:
#color: #4D926F;
body {
background-color: #color;
}
Not anything special.
My html:
<!Doctype HTML>
<html>
<head>
<title>#ViewBag.Title</title>
<link href="#Url.Content("~/Content/style.less")" type="stylesheet" rel="stylesheet/less" />
<script src="#Url.Content("~/Scripts/less-1.4.1.min.js")" type="text/javascript"></script>
</head>
<body>
#RenderBody()
</body>
</html>
The Less script file is downloaded from http://lesscss.org/
My file structure:
The result:
FileError: 'http://localhost:58123/Content/style.less' wasn't found (404)
in style.less
Index
When I install dotless via Package Manager everything works perfect.
My question is what do I need to runn it without Dotles? I dont have problems installing Dotless or using it. I just want to know whats the missing link why the LESS gives that error. Why do I get a 404 error when the file is there?
Dotless compiles the .less to .css. So you would need to add a reference to the resulting .css that Dotless compiles. Also you would want to remove this line from your code.
<link href="#Url.Content("~/Content/style.less")" type="stylesheet" rel="stylesheet/less" />
Related
I downloaded the latest copy of MathJax through Git, installed it somewhere, and wrote the following document:
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="utf-8">
<title>Notes - Wenke's Patterns in Prehistory</title>
<script id="MathJax-script" async src="../../../../MathJax/e5/tex-chtml.js">
</script>
</head>
<body>
$ e^i $
</body>
</html>
When I try to run it in a browser the console prints the message Loading failed for the <script> with source “file:///home/username/underconstruction/MathJax/e5/tex-chtml.js”..
I believe the README.md file that comes with the download indicated that tex-chtml.js was supposed to be the file to link in the HTML document. I've seen elsewhere reference to a MathJax.js file but that was not included in my download.
You specify the location ("../..") of the file "tex-chtml.js" relative to the location of the HTML-page containing $e^i$. The file is likely not there as the warning message indicates. If you specify a path relative to the current HTML-page be also sure that the relative path is the same on your localhost and on the server.
A simple method for using MathJax is given on https://www.mathjax.org.
You do not need to download MathJax from anywhere. Just include the following lines in your HTML-file:
<head>
<script>
MathJax = {tex: {inlineMath: [['$', '$'], ['\\(', '\\)']]}};
</script>
<script src="https://polyfill.io/v3/polyfill.min.js?features=es6"></script>
<script id="MathJax-script" async src="https://cdn.jsdelivr.net/npm/mathjax#3/es5/tex-mml-chtml.js"></script>
</head>
Server for PixiJS not working, "localhost sent an invalid response" error when connecting for client side
When I try connecting to the server (http://127.0.0.1:8080) through my chrome browser, I get a page which has this written on it:
"This page isn’t working
localhost sent an invalid response.
ERR_INVALID_REDIRECT"
And it also downloads a file called "download" with it. I have no idea as to why this happens. This "download" file is almost the exact same as the code in my index.html file. The code is the following:
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Testing pixi.JS</title>
<!-- The <script> tag's src should be relative to your root directory where your webserver is running -->
<script src="pixi/pixi.min.js"></script>
</head>
<body>
<script type="text/javascript">
let type = "WebGL";
if(!PIXI.utils.isWebGLSupported()){
type = "canvas";
}
</script>
</body>
</html>
<!-- MY INDEX.HTML CODE -->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Testing pixi.JS</title>
<!-- The <script> tag's src should be relative to your root directory where your webserver is running -->
<script src="./pixi.min.js"></script>
</head>
<body>
<h1>Hello there!</h1>
<script type="text/javascript">
let type = "WebGL";
if(!PIXI.utils.isWebGLSupported()){
type = "canvas";
}
</script>
</body>
</html>
CODE TYPED INTO CMD AFTER MOVING TO SAME FOLDER AS INDEX.HTML:
npm install http-server -g
http-server
I expected the page to load but it doesn't. I have no idea as to what to do.
If you navigate to the full path it seems to work: http://127.0.0.1:8080/index.html It seems to be some http-server bug.
There are many other local web servers. I suggest browsersync:
npm install -g browser-sync
browser-sync start --server --index index.html
There is a bug, it seems only affect to Windows. You should install a lower version of http-server, 0.9.0 works.
Run the following command
npm install -g http-server#0.9.0
for more info click here.
I tried to connect to a netgear D700 using opera and edge but got the same response. Eventually I used the old 32bit internet explorer and got into the router. Once the firmware was updated I was able to use opera to get into the router.
I used the express generator linked here to build a scaffold.
The 2nd thing I did was put two different 2ndary js files into place /public/js/useeasel.js and /public/js/libs/createjs.min.js
The 3rd thing I did was change the views to call those files like so
layout.hbs
<!DOCTYPE html>
<html>
<head>
<title>{{title}}</title>
<link rel='stylesheet' href='/stylesheets/style.css' />
<script src='/js/lib/createjs.min.js'></script>
</head>
<body>
{{{body}}}
</body>
</html>
index.hbs
<h1>{{title}}</h1>
<p>Welcome to {{title}}</p>
<div onload="init();">
<canvas id="cid" width=2000 height=3000></canvas>
</div>
<script src="/js/useeasel.js"></script>
End result:
localhost/:6 GET http://localhost:3000/js/lib/createjs.min.js net::ERR_ABORTED
localhost/:16 GET http://localhost:3000/js/useeasel.js net::ERR_ABORTED
Bottom line is I did 3 things, edited nothing else, and received these error messages.
I tried jackin with app.js app.use(express.static(path.join(__dirname, 'public'))); but ultimately wound up just putting it back as nothing helped.
A weird thing tho. . . occasionally I'll get:
localhost/:16 GET http://localhost:3000/js/useeasel.js 404 (Not Found)
ONLY for that file. And sometimes, even, there's 2 entries for that file, one of each of the above errors.
The /stylesheets/style.css file works, and when I moved those 2 files to the /stylesheets/ dir (and changed the script call) they still didn't work, so I guess something is puking on .js files, but since I'm just running the express tutorials I've not the slightest.
What do I need to change here to make the js files work and the error messages go away?
I am new to grunt and tests and currently I have setup like this:
Grunt running tasks after which I have build folder where I have my compiled index.html and all his resources (css, js, images)
Now I want to run tests using grunt-mocha-phantomjs and it needs additions to my index.html like:
<link href="../node_modules/mocha/mocha.css" media="screen" rel="stylesheet" type="text/css" />
Inside head tag and:
<div id="mocha"></div>
<script src="../node_modules/mocha/mocha.js" type="text/javascript" charset="utf-8"></script>
<script src="../node_modules/chai/chai.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript" charset="utf-8">
mocha.ui('bdd');
expect = chai.expect;
</script>
<script src="test.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript" charset="utf-8">
mocha.run();
</script>
Inside body tag.
I want to be able to open that modified index.html in web-browser too. (I have setup apache for it and example test works great both in grunt and web-browser)
So I am planning using task grunt-contrib-copy to copy all files from my build directory to test directory and add those lines to index.html and then launch mocha_phantomjs task.
Is this correct way to do it?
Which NpmTask can do it?
Not sure about "Is this correct way to do it?" part but I solved it.
I used grunt-html-build and its Removing parts feature.
Removing phantom's code for build folder, and keep it for testing folder.
It works great.
I get this error when trying to set up inheritance in dust.js:
500 Error: ENOENT, open 'C:\Users\Gilbert\Documents\GitHub\maths4me\base.dust'
I have a file called index.html:
{>"base.dust"/}
{<title}Hi{/title}
Which calls base.dust:
<!DOCTYPE html>
<html>
<head>
<title>{+title}Maths 4 me{/title}</title>
<link rel='stylesheet' href='/stylesheets/style.css' />
</head>
<body>
<h1>Hi</h1>
<p>Welcome to maths4me</p>
</body>
</html>
ENOENT means that file doesn't exist.
Check again that base.dust exists in provided location.
Dust partials look in the app root not the views folder, It took me some time to realise this. I was referencing a file in the wrong folder. My code should have been:
{>"/views/base.dust"/}
{<title}Hi{/title}
If you like me don't want to specify full paths to base templates and partials all the time, try out: klei-dust. (it's like consolidate but only for dustjs-linkedin)
In your scenario above you could just specify:
{>base/}
Instead of:
{>"views/base.dust"/}
...to get it to work.
Double check your names of your files. For me, I have seen this error Error: ENOENT, and I noticed that in one my main app.js, I wrote
app.get('/', function(req, res) {
res.sendfile('./views/plan.html');
});
when I in views folder,I renamed it to home.html, This error appears accordingly