I have the following directory structure:
limejs/
closure/
closure/
goog/
base.js
projects/
myGame/
myGame.html
server.js
I call "node server.js" in "cd limejs/projects/myGame". When I serve myGame.html, I want base.js to be included. Here's the script include from myGame.html:
<script type="text/javascript" src="../../closure/closure/goog/base.js"></script>
The GET attempt is on localhost:8080/closure/closure/goog/base.js. I know that if I put my server code a couple of directories higher, I can access the base.js via:
<script type="text/javascript" src="/closure/closure/goog/base.js"></script>
But I'd like to keep all of the "myGame" related code in the same folder while experimenting. Is this possible?
You're probably using express.static(dir). Files are only served from dir down, everything else is invisible. Same goes for any other static file server (Apache, ningx, etc).
You need to either serve files from higher in the directory tree, so that closure/closure/goog/base.js is accessible (from limejs in this case), or copy/link the files into your game folder.
If you're on linux/mac, ln -s closure/closure projects/myGame/closure should do the trick, then you can include <script src="closure/goog/base.js">.
Related
I am using vite purely as dev server with a backend server that does the file serving for me and has no connection to vite itself. My vite application lives under nested path. Thats why I set the base-url as specified in the config to '/my/path/'. This works well and everything is served correctly.
Once I run build, it creates a dist folder with a manifest file. My index HTML that is served by the backend server either includes the vite devserver in dev more or loads the main.ts as specified by the maninifest.json { "src/main.ts": { "file": "assets/main.b3ed3483.js", ...}}. Therefore my index HTML looks somewhat like this:
<?php if($dev): ?>
<script type="module" src="http://localhost:3000/#vite/client"></script>
<script type="module" src="http://localhost:3000/src/main.ts"></script>
<?php else: ?>
<?php $entry = parseJson('dist/manifest.json'); /* pseudocode */ ?>
<link rel="stylesheet" href="/my/path/dist/<?= $entry.css[0] ?>" />
<script type="module" src="/my/path/dist/<?= $entry.file ?>"></script>
<?php endif ?>
Now, I have the problem, that whenever a module is imported, it tries to load it from /my/path/assets instead of my/path/dist/assets. I tried changing the basepath to /my/path/dist/ but now obviously the path arent resolved in dev correctly. What do I have to do to make this work?
I am not sure if I completely understand the src paths in your script tags but I think this should work, though you might need to make some changes to make your src paths match.
Option one: If you are using linux, I would create a symbolic link from /my/path/ to/dist/assets/ e.g. ln -s -r ./dist/assets/ assets (-s for symbolic link and -r for relative links). This will provide two paths to the same directory, one from /my/path/assets and one from /my/path/dist/assets/.
Option two: use a relative base path i.e. set base in your vite config to ''. Note: in vite 2.x there is an issue where if you have multiple entry points the asset path will be incorrect. There is a fix merged for vite 3.0.
where I link index.js
<script src="/assets/js/index.js"></script>
Folder Directory is such
assests
-css
--style.css
-js
--index.js
enter image description here
Error Im getting
index.html:25 GET file:///assets/js/index.js net::ERR_FILE_NOT_FOUND
I guess you are using an express app(by the tag in question). The static resources such as your javascript, css, images, etc. should be inside the public folder which gets served on running the application. Could you try moving the assets folder inside the public folder and then have a script tag pointing to that resource.
Maybe it helps to remove the first slash:
<script src="assets/js/index.js"></script>
Or startend with a dot
<script src="./assets/js/index.js"></script>
I have new in sails.js . In layout.js in views files I have script tags like this.
<script src="/js/bootstrap.min.js"></script>
<script src="/js/jquery.countTo.js"></script>
<script src="/js/jquery.easing.1.3.js"></script>
<script src="/js/jquery.min.js"></script>
If I have changed the file and move the file jquery.min.js to the top and compile usings sails lift.
Then my layout.js changed and file remain same.
Every script between
<!--SCRIPTS-->
<!--SCRIPTS END-->
will get modified automatically by the grunt task which will parse your assets folder and put reference to every script it finds there overwriting your file. If you wish to put your script above all else, modify your pipeline.js file in the tasks folder - look for the variable jsFilesToInject and put your jquery.min.js file above all else or just move that file into /js/dependencies/jquery folder in your project.
Ok, learning here. Installed the default vue-cli app on AWS. I do a npm run build. When I launch the default index.html I'm served a blank page. If I go into dist, there is another index.html, that serves links to js files, but still a blank page.
I'm guessing webpack wants me to launch an index.html, but don't see how I can hit that with a browser. No errors anywhere. But no Hello World either. thanks for help.
What I'm seeing in the browser:
<!DOCTYPE html><html><head><meta charset=utf-8><title>hello-world</title><link href=/static/css/app.87e65e7c83fb67c04e58d4461a7fd8e8.css rel=stylesheet></head><body><div id=app></div><script type=text/javascript src=/static/js/manifest.fa7eecfb52900d1cfb0a.js></script><script type=text/javascript src=/static/js/vendor.9baeef453ba99a70f46a.js></script><script type=text/javascript src=/static/js/app.cdfbb21001bbc43de4bc.js></script></body></html>
When you npm run build Webpack should produce an index.html file along with a static/ directory that contains all of your javascript and css. The link to static/ is an absolute link (i.e. http://example.org/static). When you try to open index.html as a file, the browser will look for the /static/ folder on the root of your file system, which of course it won't find.
To run it locally you need to fire up an http server locally. One option is to cd into the directory with a terminal app and run python -m http.server. Then go to http://localhost:8000/. That should work because the root of the directory tree will be the folder from where you are serving it.
Getting it running on AWS S3 will be a matter of making sure you get the static directory in the right place and get the links pointing to it. Hard to say exactly how without knowing details of how you are organizing the site in your bucket.
You can change how the static folder is saved in the webpack config if you need to: https://vuejs-templates.github.io/webpack/static.html
You will find a folder named /dist in your project directory.Just point the index.html file within the /dist directory and rest will work fine I think. I have just done that and it's working fine.
Hope it will work.
Thanks.
I am attempting to make a small website with a directory structure like this:
rootURL/
landing/
aboutME/
common/
app1name/
app2name/
etc...
Within each of the sub folders are the directories css/ , js/ and html/ so I keep my pages and apps separate and my file types separate within them, which seems sensible to me.
My root page I want to load when some one goes to rootURL.com is
rootURL/landing/html/landing.htm
1) Is this something which can be typically configured on a web server?
2) And is it possible to reference paths to css and script files in different directories? For example my lanidng page rootURL/landing/html/landing.htm , can it use the line
<script type="text/javascript" src="rootURL/common/jQuery.js"></script>
and if not is there anothr way to access files in other directories?
Thanks
All of that is possible. For your landing page, will either have to have a redirect page in the root directory, use URL rewriting, or simply put your home page in the root directory.
To reference paths you can use
<script type="text/javascript" src="/path/to/file.js">
or
<script type="text/javascript" src="../relative/path/to/file.js">
or
<script type="text/javascript" src="http://rootURL.com/path/to/file.js">