Error: An anomaly token was encountered while deploying a Laravel/Vue project using the pipeline yml in Yarn Run

I have encountered a challenge while trying to deploy my project to a server using bitbucket-pipeline with a .yml script. The project consists of a Laravel backend with PHP 7.4 and a Vue Js frontend. The issue arises during the frontend build process with Yarn Run. Interestingly, the build process works perfectly on both my colleague's and my local machines with identical yarn.lock and package.json files, but not in the pipeline. Additionally, we are running the same node and yarn/npm versions locally.

Below is our current pipeline script:

    image:
    name: atlassian/default-image:2
definitions:
    steps:
        - step: &laravel-deploy
              name: Laravel Deployment
              caches:
                  - composer
              image: php:7.4.12-fpm
              script:
                  - mkdir -p "$REMOTE_PATH/$BITBUCKET_BUILD_NUMBER"
                    //rest of the script remains unchanged...

The specific error occurs at the following step: - yarn run $YARN_RUN, leading to an error message that consistently states SyntaxError: Unexpected token :

//error messages continue here...

This is our package.json file:

{
  //package.json contents remain unchanged...
}

We have attempted various solutions including updating babel packages, modifying the babelrc file, and testing different package managers without success so far.

Answer №1

After encountering a similar issue, we were able to find the solution. The problem lied in the execution of the following command :

- mv * $REMOTE_PATH/$BITBUCKET_BUILD_NUMBER

The 'mv' command only moves files that do not have a filename starting with a .. Since the babelrc file begins with a ., it was not being moved. This caused the plugins to fail to load and resulted in compilation errors. To rectify this, we modified the command as follows:

mv * .babelrc $REMOTE_PATH/$BITBUCKET_BUILD_NUMBER

Once this adjustment was made, everything functioned correctly.

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

After the submit button is disabled, the form fails to be submitted

Hello, I am having an issue with disabling my button after the form is submitted. The button gets disabled, but the PHP code does not execute. I have tried various scripts from the internet, but they all seem to have the same result: the button gets disab ...

Guide to making control bar fade out when video is paused on video.js

Is there a way for the control bar to automatically disappear when the video is paused? Thank you in advance! ...

Communication between Laravel and controller using AJAX for exchanging information

I have a specific AJAX function being called from a view: function gatherProductData() { var productIds = []; $('#compare-widget tbody tr').each(function(i, ele) { productIds[i] = $(ele).data('product-id'); }); ...

``What is the best way to set up the Vue app based on the initial back-end response?

I'm in need of a way to run some code before any other functionality in my app is executed. This code needs to send a request to the back-end and update the store first, as route guards depend on it. How can I achieve this? Code Example Fetching user ...

`Is there a way to effectively test an @Input component in Angular?`

Despite multiple successful attempts in the past, I am facing some difficulty getting this to function properly. Within my component, I have an input @Input data: Data, which is used in my template to conditionally display certain content. Oddly enough, du ...

What steps should I take to resolve the issue where Angular project error states that the data path "/polyfills" must be a string?

I am struggling with deploying my Angular app to Firebase and/or running it successfully locally using NodeJS version 18. To access the package.json and source code, you can click on this link: https://github.com/anshumankmr/jovian-genai-hackathon/blob/mas ...

How can I properly integrate the datatables.net plugin with a Vue application using Webpack?

I am currently working on a Vue Webpack project that requires the use of DataTables as a plugin. However, integrating jQuery, which is needed for DataTables, directly into my Vue component has proven to be a challenge. Here's how I'm currently h ...

Pattern matching for ' ... '

I've been struggling to make a regular expression work properly: I need it to match anything that starts with __(' or __(" and ends with ') or ") I attempted using /__\(['"][^']*['"]\)/g and /__\([&apos ...

Searching in real-time using Vue.js with multiple parameters

Is there a way to implement a real-time search feature using vue, where the API requires 3 parameters - select option 1, select option 2, and text input field? For instance, you can use the following format for the API link: http://example.com/api/?para ...

A step-by-step guide on effectively swapping out every element in an array with its corresponding index location

After pondering over this question and conducting a search to see if it has been asked before, I couldn't quite find the answer due to difficulty in phrasing my inquiry. In case this question has already been addressed, I apologize for any duplication ...

The object is given a value in the form of a string, even though it is a strongly-typed variable

I'm encountering something unusual in my code. In the following example, there is a (change) event that captures the current value selected by the user from a dropdown menu. <div style="padding-right: 0; width: 100%;"> <label st ...

Extract the raw text content from nested elements

Working with highlight.js to include a custom CSS code, however, this library automatically adds span tags around the desired text For example: <pre> <code class="language-css hljs" contenteditable="true" id="css-code&quo ...

Vue-Router failing to redirect in a Single Page Application using Vue and Laravel

I have been attempting to implement vue-router in a Vue.js/Laravel project. My project consists of two simple pages: home page: https://i.stack.imgur.com/GmHOR.png about page (single-page scrolling): https://i.stack.imgur.com/CZDnZ.png The files used ...

Restricting Entry to a NodeJS Express Route

Currently, I am in the process of developing an express project where I have set up routes to supply data to frontend controllers via ajax calls, specifically those that start with /get_data. One issue I am facing is how to secure these routes from unauth ...

Unable to trigger onSelect event on the datepicker component

Whenever a date is chosen, I need to trigger a javascript function. Here is the javascript code: $(document).ready(function(){ var date_input=$('input[name="date"]'); //our date input has the name "date" var container=$('.bootstrap- ...

Struggling to map a JSON file in a NextJS project using Typescript

I'm a beginner in JS and I'm currently struggling to figure out how to display the data from a json file as HTML elements. Whenever I run my code on the development server, I encounter the error message: "props.books.map is not a function&q ...

Uploading files in AngularJS using Rails Paperclip

I have been working on implementing a file upload feature with AngularJS/Rails using the Paperclip gem. I was able to resolve the file input issue with a directive, but now I am facing an issue where the image data is not being sent along with other post d ...

Unusual marker appearing on every page utilizing ionic v1 and angularjs

For some unknown reason, a dot appears at the upper left side of each page in my webapp: https://i.stack.imgur.com/nN61t.png It seems to be an issue with the HTML code. When I run the snippet below, the dot is visible: <ion-view view-title="Send fe ...

React Virtualized - Blank screen issue occurring because of continuous scrolling through a large list of ITSM items

I am currently working on a lengthy list of items and utilizing the react-virtualized library for this purpose. However, I have encountered an issue that needs addressing. https://i.stack.imgur.com/ROdjp.gif Upon attempting to scroll down for 2 seconds, ...

Troubleshooting VueJS, Electron, and Webpack integration with Hot Reload feature

I have been immersed in a new project that involves utilizing Electron, VueJS, and Webpack for HMR functionality. Unfortunately, I am encountering difficulties with the Hot Module Replacement feature not working as expected. Here is my current configurati ...