Syntax Error: The function `loadReposFromCache(...).error` is not defined in this building

I'm currently attempting to utilize the SyntaxHighlighter v4 plugin, but I'm facing issues with the build process!

While following the guidelines provided here, an error popped up:

$ ./node_modules/gulp/bin/gulp.js setup-project
[10:12:20] Requiring external module babel-register
[10:12:20] Using gulpfile C:\git\syntaxhighlighter\gulpfile.babel.js
[10:12:20] Starting 'setup-project:clone-repos'...
[10:12:20] 'setup-project:clone-repos' errored after 1.96 ms
[10:12:20] TypeError: loadReposFromCache(...).error is not a function
    at loadRepos (C:/git/syntaxhighlighter/build/setup-project.js:39:48)
    at Gulp.<anonymous> (C:/git/syntaxhighlighter/build/setup-project.js:48:5)
    at module.exports (C:\git\syntaxhighlighter\node_modules\orchestrator\lib\runTask.js:34:7)
    at Gulp.Orchestrator._runTask (C:\git\syntaxhighlighter\node_modules\orchestrator\index.js:273:3)
    at Gulp.Orchestrator._runStep (C:\git\syntaxhighlighter\node_modules\orchestrator\index.js:214:10)
    at Gulp.Orchestrator.start (C:\git\syntaxhighlighter\node_modules\orchestrator\index.js:134:8)
    at C:\git\syntaxhighlighter\node_modules\gulp\bin\gulp.js:129:20
    at _combinedTickCallback (internal/process/next_tick.js:67:7)
    at process._tickCallback (internal/process/next_tick.js:98:9)
    at Module.runMain (module.js:606:11)
(node:2532) UnhandledPromiseRejectionWarning: Unhandled promise rejection (rejection id: 1): Error: ENOENT: no such file or directory, open 'C:\git\syntaxhighlighter\.projects-cache.json'

It appears that the github repository files are not being imported to the /repos/ directory. Is there a manual way to do this? Or perhaps an alternative method to successfully build and use it? Maybe even locate the built files similar to v3?

Below is the problematic function in build/setup-project.js

gulp.task('setup-project:clone-repos', 'Clones all repositories from 
  SyntaxHighlighter GitHub organization', () =>
    loadRepos()
      .then(R.filter(repo => !fs.existsSync(pathToRepo(repo))))
      .then(R.filter(repo => repo.name !== 'syntaxhighlighter'))
      .then(R.map(R.curry(cloneRepo)))
      .then(Promise.all)
);

Following along backwards we find:

const loadReposFromCache = () => fs.readFile.promise(REPOS_CACHE, 'utf8').then(JSON.parse);
const loadRepos = () => loadReposFromCache().error(loadReposFromGitHub).then(R.map(R.pick(['clone_url', 'name'])));

function loadReposFromGitHub() {
  const request = require('request');

  const opts = {
    url: 'https://api.github.com/orgs/syntaxhighlighter/repos?per_page=300',
    json: true,
    headers: { 'User-Agent': 'node.js' },
  };

  return new Promise((resolve, reject) =>
    request(opts, (err, response) => {
      if (err) return reject(err);
      const json = response.body;
      fs.writeFile(REPOS_CACHE, JSON.stringify(json, null, 2));
      resolve(json);
    })
  );
}

Answer №1

There seem to be a few issues with the build code for that particular project.

One specific issue is that the Songbird wrapper on Bluebird promises no longer seems to be compatible, resulting in the error message ".error is not a function" (works fine on Bluebird).

To resolve this, you can either replace .error with .catch or switch from using require('songbird') to require('bluebird').

However, fixing this issue is just the beginning of the challenges you may encounter during the build process...

I have made a note of this issue in the project's tracking system. In the meantime, here is what I did to successfully build it: https://github.com/karljacuncha/syntaxhighlighter/commit/dc015fa299d4d249e8518664e205a838c55372cf

Answer №2

Once again, the build has encountered issues in April 2021. I took inspiration from karljacuncha's response and made modifications by replacing the call to fs.writeFile with fs.writeFileSync

To view the changes made, visit https://github.com/BartJolling/syntaxhighlighter/commit/7dbd08203cba8ef3be72cbe1abbfb3475be19ef4

In addition to this, I have implemented several other fixes that were suggested within the community. Furthermore, I have rectified the usage of the -output parameter.

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

Problem with using React state hook

Trying to implement the state hook for material-ui's onChange feature to manage error texts, I encountered an issue. I have included a screenshot of the error displayed in the console. https://i.sstatic.net/qjed8.png Below is the snippet of my code: ...

What steps can I take to ensure that an image does not exceed the size of its parent tag?

Is there a way to ensure that items placed in a container do not exceed the boundaries of the container? I am trying to use my logo as the home button, but when I set the image height and width to 100%, it becomes larger than the nav bar. The CSS for the n ...

What is the best method for extracting a particular value from my dataset?

I'm interested in creating a variable that stores the IsUserSiteOwner value from the data. Can someone help me with this? Any suggestions on how I can achieve this task? ...

Peculiar redirection encountered while handling a form with checkbox option

When I try to submit the form in Chrome, the PHP file does not get called and I am redirected to another HTML page. However, in Firefox, when I select three checkboxes, it redirects me to that same HTML page as in Chrome. I even tried using radio buttons i ...

Mismatched data types for function arguments

const x: Example = { toY: (y: Maple) => { return y.p; } }; interface Example { toY: (y: Pine) => void; } interface Pine { c: string; } interface Maple extends Pine { p: boolean; } Despite the warning for interface names ...

Place the button inside the form following another block element

Here is the HTML code I am working with: <div class="actions"> <input id="submit-car" name="commit" type="submit" value="Добавить объявление"> </div> and here is a fiddle example: http://jsfiddle.net/348U4/ In ...

Creating a regular expression to match special characters using JavaScript

I'm making an attempt to verify certain characters in my code. If the input field contains specific characters for each character, it will return true; otherwise, it will return false. function isChar(value) { //Creating a regex pattern to permit ...

"Exploring Angular: A guide to scrolling to the bottom of a page with

I am trying to implement a scroll function that goes all the way to the bottom of a specific section within a div. I have attempted using scrollIntoView, but it only scrolls halfway down the page instead of to the designated section. .ts file @ViewChild(" ...

The image slider is blocking the dropdown functionality of the navbar on mobile devices

My code is experiencing a conflict of events. I have created a menu bar using nav bar, as well as an image slider called the caroussel. The issue arises when the window is minimized - the menu bar fails to drop down properly with the presence of the caro ...

Improving HTML coding with a more effective alternative to document.write()

Looking at the setup of my website, I have a menu button and comments section that need to appear on every page. Instead of manually adding this code to each HTML file, I decided to streamline the process by using a JavaScript file that generates all of th ...

Implementing the @media rule using Javascript

I'm trying to use JavaScript to add an image dynamically, but I want to remove it when the viewport is 600px or wider. This is my approach so far: var img = document.createElement('img'); // (imagine here all the other fields being defined ...

How can I modify certain attributes within an array of objects?

https://i.sstatic.net/TKkcV.jpgI need help with updating properties within an object array. Below is my code for reference. I have an object array consisting of two arrays, where the first one contains attribute "first" and the second one contains "last". ...

Adjust the positioning of a class element

I have an eye icon that changes position when clicked. Initially, it is set to left: 10%;, but if there is a DOM element with the ID login-section, it should be repositioned to left: 50%;. I attempted to use document.getElementsByClassName('fa-eye-sl ...

The redirection code is not being executed when calling .pipe() before .subscribe()

My AuthService has the following methods: signUp = (data: SignUp): Observable<AuthResponseData> => { const endpoint = `${env.authBaseUrl}:signUp?key=${env.firebaseKey}`; return this._signInOrSignUp(endpoint, data); }; signIn = (data: SignIn): ...

The process of generating collection names dynamically based on user information

My goal is to enhance the structure of my data collection and make it more organized. While I am familiar with accessing and retrieving data, I am unsure about creating the schema. Here is my current schema: var MySchema = new Schema ({ event: { ...

Elements in Motion

Working on a parallax effect, I've managed to assign unique scroll speeds to (almost) every element. Moreover, these elements are programmed not to activate their scroll speed until they enter the viewport. Below is the JavaScript code for trigger co ...

The verification of form is not done using an if statement

There are two forms in my code named formA and comments that I need to submit via AJAX. However, the current if and else conditions do not correctly identify the form and always trigger the alert message hello3. Here is the JavaScript function: function ...

Implementing authentication middleware with React Router in a React component

Working on my app.js, I'm trying to implement an Auth component that acts as middleware to check if the user is logged in. const App = props => ( <BrowserRouter> <Provider store={store}> <div className="app"& ...

Exploring the functions of `map` and `filter` in the world of

Consider this input: var m = [{ name: 'foo', routes: [{verb: 'post', path: '/foo1'}, {verb: 'get', path: '/foo2'}] }, { name: 'bar', routes: [{verb: 'put', path: ...

The jQuery pop-up fails to activate on the initial click

I have multiple "Buy Now" buttons for different products. If the button is labeled as "sold-out," it should not do anything, but if it's available, it should trigger a jQuery Magnific Popup. Currently, the popup only opens after the second click becau ...