Setting up Yeoman-- multiple bower_components - javascript

First time setting up a Yeoman app. I think I understand how bower works... but my app seems to be having trouble finding jquery.js (and perhaps other libraries).
The console message is
Failed to load resource: the server responded with a status of 404 (Not Found) [localhost]/bower_components/jquery/dist/jquery.js
which seems pretty straightforward... it's not linking up properly (duh). I went back into the directory structure of my app, and it looks like there are two /bower_components/ folders.
One of the folders (the one outside of the /app/ directory) only has a jquery folder. The other one (inside the /app/ directory) has all of my libraries and goodies (coffee-script, jquery, ember, etc...).
First: Are there supposed to be two /bower_components/ folders (one for production and one for local perhaps)?
Second: How can I get my app to grab the js from the correct folder?
EDIT:
Please unmark as duplicate. I already saw that question. My .bowerrc file is pointing to the correct directory.
{
"directory": "app/bower_components"
}

You likely have a global .bowerrc. Check for one in ~/, which specifies:
{
"directory": "bower_components"
}
Get rid of that file and see if it helps!

Related

Next js serve static js files not working

I have this folder structure for my next.js project
/public
|static
-hello.png
|sample
-test.js
|charting_libray
|bundle
-dist.js
|hello.png
In my local environment
http://localhost:3000/static/hello.webp
http://localhost:3000/hello.webp
http://localhost:3000/static/sample/test.js
All of these works. This means JS, Image anything can be served from nested folders or directly from the public folder.
But when I build the project using next build command and deployed it to the production.
mydomain.com/static/hello.webp
mydomain.com/hello.webp
mydomain.com/static/sample/test.js
I have noticed only the images files can be accessed and the JS file returns 404.
My real-world use case is, inside a component I pass the path to a library like this
libraryPath: "/static/charting_library/"
I can see a net::ERR_ABORTED 404 error in the prod env browser console. Somehow the library works even with this 404 error.
But I need to know the reason for this 404 error and need to fix in the code.
Any help!
Thanks in advance.

Cannot find module (trying to load a module from a folder)

I'm new into webpack, and I'm having an issue trying to resolve a subdependency.
I'm importing a dependency that is trying to require a module from a specific folder (not the node_modules) (let's call it subdependency). That folder contains two files:
subdependency/package.json
subdependency/build/Release/addon.node
subdependency/lib/src/index.js (this index.js requires the addon.node)
I'm using webpack, and when importing my dependency it was not able to find subdependency.
The subdependency is there but it was not accessible. I added a loader for loading .node files https://www.npmjs.com/package/native-ext-loader and it was still not working; trying to identify what was happening I modified in my build the require path from ./subdependency to ./subdependency/build/Release/addon.node and the file was accessible (so I guess the native ext loader is working fine, but it's not loading other files like the index.js).
I think the problem is that webpack is not able to understand that ./subpdendency is a module, or that I'm not loading it correctly.
Any suggestion or idea is welcome!
I resolved the issue by forking the dependency and switching from node-pre-gyp to prebuildify, since node-pre-gyp doesn't works fine with webpack.

SailsJS: Requiring Assets, Such As, sails.io.js

As the problem is short & sweet, I'll keep the question so.
CAN'T LOAD ASSETS.
Using Sails.js (v0.11.n).
Can't load assets... That's about it...
I'm trying to load sails.io.js -- or now even just assets/alert.js.
<script type="text/javascript" src="/js/dependencies/sails.io.js"></script> Doesn't work :(
Even when I switch the src to /alert.js -- nothing.
I'm pasting this script tag inside of my /signup view -- which loads fine -- but I know sure as heck I'm doing something(s) wrong.
This was due to an issue with the sails new app generator that has been fixed. The issue was that for any new app, the Grunt hook would be disabled, so that your assets would not be copied automatically into your app's .tmp/public folder at lift time. This is only supposed to happen if the --no-front-end option is used with sails new, but it was happening all the time. You can check for this problem by looking in your app's .sailsrc file; if you see:
"hooks": {
"grunt": false
}
remove it, and your assets will be accessible again.
Grunt is taking care of the asset pipeline for you. If you look in the source for layout.ejs, you'll find some tags for your assets. Grunt is automatically looking into the assets folder, and is including them into your layout.

How to use webshim with assetic in a Symfony2 project?

I would like to use Webshim in a Symfony2 project.
So far, the webshim library is in mybundle/Resources/public/components/webshim...
The webshim library has a polyfiller.js that loads specified scripts from the ./shims directory. This is also clearly explained from the webshim docs:
The code inside of the polyfiller.js automatically detects the path to the script it is run from and assumes, that the shims folder is in the same directory. This means, you have to make sure, that either the shims folder is placed parallel to the code of the polyfiller.js or to configure the path using the basePath option.
I'm using other libraries and they all end in the /web/js or /web/css directories as they should do. They are combined and have names like "6464de0.js" and are perfectly accessible.
But, webshim tries to load scripts from the shims folder. This makes sense when you look at the docs.
This is an example of 404's in the console:
GET http://domain.dev/app_dev.php/js/shims/combos/1.js 404 (Not Found)
How can I make the webshim library work with assetic?
I have the same issue and here is what I did:
Put the 'shims' folder in the public folder of your desired bundle (eg. AcmeBundle/Resources/public/js/shims) then when you do assets:install using the console command it will be installed in the Symfony/web directory.
Then set the webshim option so that it points to that path:
webshim.setOptions('basePath', '/bundles/acme/js/shims/');

How do I make text files accessible to the server on Meteor

I'm surprised I can't google my answer here... it seems no one else is having the issue.
When you run the meteor service the js, html, etc. is packaged in the .meteor/local/build folder, but it appears to exclude stuff that isn't js or html. I have a folder called "magicsets" and one called "magicimgs" and neither are in the /local/build folder. This is obviously why, when i attempt to use fs to readfile, it fails to find the file "magicsets/M14.json"
I tried putting the magicsets folder into a folder named "private", but that didn't accomplish anything.
How do I make files accessible locally to my server via FS and how do I make files accessible publically to my server via raw urls?
I'm sure I'm missing something very simple, because there are lots of more complicated questions and answers on SO, yet there is no answer for this. Thanks.
Meteor 0.6.5 which was released yesterday has a new feature which helps loads with this.
Make a directory called /private which you can access with the new Assets.getText or Assets.getBinary functions.
The stuff in the /private directory will then be bundled up into a directory called assets in /program/server/assets and it will not be accessible to the web & you wouldn't need to worry about using fs either. You could just use Assets.getText instead
To make a publicly accessible file put it in /public. So if you had a.jpg at /public/a.jpg it would be accessible at http://yourdomain.com/a.jpg
If you want text files to be available to the webserver i.e. the server that defaults to port 3000, create a folder called public in the root of the project/app directory. drop your folder and files there. You would then be able to access them as http://localhost:3000/magicsets/M14.json
update: it looks like can override the bundler, but it does require changing some of the core code there's no .meteorignore file yet. check this SO answer out: https://stackoverflow.com/a/16742853/105282
To serve a directory of files publicly independent of what Meteor is doing, you can use the following approach. I do this, for example, when I need to link an entire (Javascript) git repo into my Meteor app so I can work on a checked out version of the library.
The following works for 0.6.5. It basically servers up a checked out folder of OpenLayers in /lib:
connect = Npm.require('connect')
RoutePolicy.declare('/lib', 'network')
WebApp.connectHandlers
.use(connect.bodyParser())
.use('/lib', connect.static("/home/mao/projects/openlayers/lib"))
For more information, see https://github.com/meteor/meteor/issues/1229.

Categories

Resources