Bower downloads the identical package but arranges it in a distinct file structure

We operate a TeamCity build server that is utilizing three different buildusers all configured similarly. We have integrated an angular/grunt project using yeoman

Update 6

Noted an issue with bower https://github.com/bower/bower/issues/1709

Why does bower occasionally install packages like angular-animate in the following structure:

bower_components/angular-animate/bower-angular-animate-1.3.13/angular-animate.js

while other times it places the contents of bower-angular-animate-1.3.13 directly in the root resulting in this structure:

bower_components/angular-animate/angular-animate.js

The former causes our tests to fail, naturally..

Any insights on this? It always seems to happen with the same packages and works fine locally.

Update:

It seems that when running bower, it fails to locate the main JavaScript file specified in the package's bower.json which appears to be the root cause. However, I am unsure how to address this issue.

Update 2:

It appears that bower cannot find the "main" key in bower.json for example: 

[09:27:40]bower angular-animate#1.3.13          invalid-meta angular-animate is missing "main" entry in bower.json
[09:27:40]bower angular-animate#1.3.13          invalid-meta angular-animate is missing "ignore" entry in bower.json

What could be causing the inconsistency in finding the main file?

Update 3:

If my understanding is correct, the .bower.json file is generated by bower after downloading and extracting the archive. Upon observation, there are differences in the generated .bower.json file where the main and ignore entries are missing. Additionally, the extraction process varies as mentioned previously.

This package fails:

[pejn@bx0023 1.3.13]$ more .bower.json
{
    "name": "angular-animate",
    "homepage": "https://github.com/angular/bower-angular-animate",
    "version": "1.3.13",
    "_release": "1.3.13",
    "_resolution": {
        "type": "version",
        "tag": "v1.3.13",
        "commit": "f18cb98590471ad9c1e5ae0e57178e9ecb8d384c"
    },
    "_source": "https://github.com/angular/bower-angular-animate.git",
"_target": "1.3.13"
}

And this one works:

[pejn@bx0023 1.3.13]$ more .bower.json
{
    "name": "angular-animate",
    "version": "1.3.13",
    "main": "./angular-animate.js",
    "ignore": [],
    "dependencies": {
            "angular": "1.3.13"
    },
    "homepage": "https://github.com/angular/bower-angular-animate",
    "_release": "1.3.13",
    "_resolution": {
        "type": "version",
        "tag": "v1.3.13",
        "commit": "f18cb98590471ad9c1e5ae0e57178e9ecb8d384c"
    },
    "_source": "https://github.com/angular/bower-angular-animate.git",
    "_target": "1.3.13"
}

Update 4:

Presenting my bower.json file

{
  "name": "App",
  "version": "0.0.1",
  "dependencies": {
    "angular": "1.3.13",
    "json3": "3.3.0",
    ...
    // Truncated for brevity
    ...
    "angular-ui-utils": "bower-unique"
  },
  "devDependencies": {
    "angular-mocks": "1.3.13",
    "angular-scenario": "1.3.13"
  },
  ...
}

Update 5

After running the bower tests on the buildserver, it appears there may be a proxy or permission issue surfaced. We are encountering a 403 error. Sections of the output regarding the bower tests are highlighted below:


// Output snippet showcasing errors related to proxy/permission issues from the buildserver
...
javascriptgruntjsnpmboweryeoman-generator-angular

Answer №1

Encountering the identical problem, we discovered that it pertained to the tmp directory used by bower being located on nfs storage. Make sure to double-check if your tmp directory (whether specified in .bowerrc as "tmp" or through the environment variable TMP_DIR) is not on nfs mounted storage.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Issue with Javascript redirect not working following form submission in combination with Asp Classic

After countless hours of research and experimentation, I find myself at a standstill. My web page is coded extensively, so I'll do my best to provide a concise summary. The core elements of my ASP CLASSIC page for creating tickets via a form are as f ...

javascripthtmlasp-classic

Issue encountered with connecting Node.js to Oracle Database: Error - TypeError: oracle.getconnection is not a recognized function

export class DataBaseConnector { establishConnection() { let connection; const oracleDB = require('oracledb'); try { connection = oracleDB.getconnection({ user : 'user', password : 'password&apo ...

node.jsoracleselenium-webdrivernpmprotractor

Leveraging ES6 with jQuery in Symfony 4

Currently working on a simple app using Symfony 4 and trying to add custom triggers in JavaScript. Having trouble getting my additional code to work as expected, even though it's compiled by Webpack via encore. It seems like my event is not triggering ...

javascriptecmascript-6symfony4webpack-encore

The reason why React.js does not automatically bind its functions to the "this" object

I cannot understand the purpose of a function not being bound by this object. In my opinion, all functions should be bound by 'this'. So why doesn't Reactjs automatically set bind(this) by default? For instance, in the code below, if I didn& ...

javascriptreactjs

The hiding/showing of elements is not being executed correctly by jQuery

My web template includes HTML and jQuery code for a project I'm working on. During the $.getJSON call, there can be a delay in loading the data. To inform the user to wait, I added a warning message in a div with the id="warning". The code properly ...

javascriptjqueryhtmlcss

increasing the `WeakSet` size while simultaneously causing a memory overload

There's something strange I observed. Despite using a WeakSet which should not retain any references, the code below still manages to exhaust memory: 'use strict'; require('babel-polyfill'); const s = new WeakSet(); for (let i = ...

javascriptnode.jsecmascript-6babeljs

Optimizing Require.js File for Efficient Loading

I have successfully implemented require.js with multiple individual files: require(['app/login/Login'], function (app) { new app.Login(); }); Everything is functioning as expected, with each module loading when needed. Recently, I have opti ...

javascriptrequirejs

Generate unique identifiers in HTML

Below is my HTML and JavaScript code: <!DOCTYPE html> <html> <head> <style> .custom-div { border: 1px solid green; padding: 10px; margin: 20px; } </style> <script> ...

javascripthtml

How can I define the PropType for an object containing a combination of strings and functions?

Trying to define a prop, which is an object of strings and functions. I set proptypes as component.propTypes = { propName: PropTypes.objectOf(PropTypes.oneOf([PropTypes.string, PropTypes.func]) } However, I encountered an error message stating that it r ...

javascriptreactjstypesmaterial-uireact-proptypes

Send the user to an Angular route once they have successfully authenticated with Google

I'm facing an issue with redirecting users to an Angular route. Here's the scenario: When I'm on the login page and click on Google login, I get redirected to Google for authentication. After successfully logging in, I want to be redirecte ...

javascriptnode.jsangularexpress

The catch-all route handler is triggered following a response being sent by a designated route handler

Currently, I am facing a peculiar issue with the routing on my Express-based server while trying to implement authentication. Here's a snippet of code that highlights the problem: app.get('/', function (req, res) { console.log('thi ...

javascriptnode.jsroutesexpress

Enhance Vuetify functionality using TypeScript for custom components

I'm facing a challenge with extending a Vuetify component and setting default props in TypeScript. While I had success doing this in JavaScript, I am struggling to do the same in TS. Below is an example of how the Component was implemented in JS: imp ...

javascripttypescriptvue.jsvuetify.js

Tips for obtaining the output of an asynchronous function that contains a query within a loop

I am facing an issue where I need to retrieve a value after the completion of a for loop that is nested within an asynchronous function. The loop contains a query that inserts data into a database. The function seems to be functioning correctly, but when ...

javascriptmysqlexpressasynchronous

Outdated JavaScript Alert

Is it possible to use JavaScript to create an alert message in my input field when a past date is selected? I would like the warning to say "past date, please enter a valid date." <html lang="en"> <head> <meta charset="U ...

javascripthtml

Transmit the canvas image and anticipate the AJAX POST response

I need to send canvas content to my API endpoint using ajax and wait for the response before moving on to the next function. Here is my current sending function: function sendPicture(){ var video = document.getElementById('video'); var canvas ...

javascriptajax

Initial React render fails to retrieve API data

I've encountered an issue during development where the page loads before the API data is sent. I attempted to use asynchronous functions, but it didn't resolve the problem as expected. I suspect that my approach may be incorrect. Here's a sn ...

javascriptreactjsreact-hooksnext.js

Creating a bar chart in Chart JS using an array of data objects

I need to create a unique visualization using a bar chart where each bar represents a user or student. Each bar will have an xAxis label displaying the student's name. The code below is a VueJS computed property named chartData For my bar chart data ...

javascriptvue.jschart.js

Is it normal for Tailwind animation to loop twice when transitioning between pages in Next.js?

I'm currently utilizing react-hot-toast for displaying alerts and animating them during page transitions. The animation involves a double fade-in effect when transitioning between pages. In my project, I've integrated tailwindcss-animate within ...

javascriptreactjsanimationnext.jstailwind-css

JQuery is having trouble locating a variable in a different JavaScript file

Currently, I am utilizing the cakephp framework and have developed 2 distinct javascript files which I have stored in my webroot/js directory. The first javascript file includes modal dialog variables that define the settings for the dialog boxes. The seco ...

javascriptjqueryvariablesundefined

Tips for implementing vue.js composition api with vue-3-socket.io

Is there a way to access the socket instance within the setup function of a Vue.js component? I am utilizing vue-3-socket.io in my main.js import VueSocketIO from 'vue-3-socket.io' import SocketIO from 'socket.io-client' Vue.use(new ...

javascriptvue.jssocket.io