Reputation: 1287
I have a build script in node that at one point rewrites all ./src references in links to ./dist references. I have been reading up on util.promisfy and have tried to incorporate async/await into my script but it is not working as planned. I can move my files over to the /dist directory from /src and uglify index.js and compress my images ok but using node fs functions for the reading and writing of my index.html file to update links is not working. Here is the pertinent parts of build.js:
const fs = require("fs");
const fc = require("file-copy");
const { promisify } = require("util");
const copyFileAsync = promisify(fs.access); // convert fs.access to a promise
const readFileAsync = promisify(fs.readFile); // convert fs.readFile to a promise
const confirmWriteAsync = promisify(fs.stat); // convert fs.stat to a promise;
const writeFileAsync = promisify(fs.writeFile); // convert fs.writeFile to a promise
const mkdirp = require("mkdirp");
// Compressed and uglified files here ok //
// ============ Copy index.html to dist/index.html(copyIndexHtml) ============ //
/* jshint ignore:start */
const copyIndexFile = async function(result) {
try {
console.log(result);
await copyFileAsync(
"./index.html",
fs.constants.R_OK | fs.constants.W_OK
)
await fc("./index.html", "./dist/index.html");
} catch (err) {
console.log("ERROR:", err);
}
return "Copied Index.html to /dist!";
}; // end copyIndexFile
/* jshint ignore:end */
// ================== End copyIndexFile ================ //
// ====== Read data from dist/index.html(getData) =============== //
/* jshint ignore:start */
const getData = async function(result) {
console.log(result);
// Lets update dist/index.html file src and href links to reflect new location.
console.log(
"index.html: Redoing file links to reflect move to /dist folder."
);
try {
const fileContents = await readFileAsync("./dist/index.html", {
encoding: "utf8"
});
console.log("CONTENT:", fileContents);
// check and replace both src= and href= links to reflect chenge to dist/ folder
// Notice we chained .replace to do it
const regEx1 = /src\s*=\s*"\.\/src\//gi;
const regEx2 = /src\s*=\s*'\.\/src\//gi;
const regEx3 = /href\s*=\s*"\.\/src\//gi;
const regEx4 = /href\s*=\s*'\.\/src\//gi;
let distIndexHtml = fileContents
.replace(regEx1, 'src="./')
.replace(regEx2, "src='./")
.replace(regEx3, 'href="./')
.replace(regEx4, "href='./");
console.log(distIndexHtml);
// Confirm Write to index.html
await confirmWriteAsync("./dist/index.html", function(err, stats) {
if (err) {
console.log(`Error: ${err}`);
} else if (stats.size === 0) {
console.log(`Error copying index.html!!!!!!`);
} else {
console.log(
`Succesfully copied to dist\index.html. File size is ${
stats.size
}`
);
}
});
await writeFileAsync(
"dist/index.html",
distIndexHtml,
"utf8",
err => {
if (err) {
reject(err);
} else {
resolve("Write to dist//index.html OK.");
}
}
);
} catch (err) {
console.log("ERROR:", err);
}
return "Read /dist/index.html file!!";
};
/* jshint ignore:end */
// ==================================================== //
// ========== Call promise chain ====================== //
// ==================================================== //
browserifyJS()
.then(
result => {
return compressImages(result);
},
err => {
console.log(err);
return compressImages(err);
}
)
.then(result => {
return copyIndexFile(result);
})
.then(result => {
return getData(result);
})
.then(result => {
console.log(result);
});
} // mkdirp else end
}); // mkdirp callback end
}); // rimraf callback end
Updated console readout after correction:The console readout is :
npm run build
> [email protected] build C:\Users\akillian\Local Documents\GitHub\sports-page-app
> node ./scripts/build
main.css: build and uglify
Checking for index.js
Bundling Successful!
Images Compressed!!!
/dist/index.js: build and uglify
Copied Index.html to /dist!
index.html: Redoing file links to reflect move to /dist folder.
CONTENT:
Succesfully copied to distindex.html. File size is 3059
~\Local Documents\GitHub\sports-page-app [refactor-app ≡ +0 ~1 -0 !]
CONTENT is blank now.
Upvotes: 1
Views: 498
Reputation: 8617
You have this:
await copyFileAsync(
"./index.html",
fs.constants.R_OK | fs.constants.W_OK,
err => {
if (err) {
console.log("No index.html file present!");
} else {
// Note: fc() returns a promise and no .catch()
// This also means the code continues on without
// waiting for the file to copy.
fc("./index.html", "./dist/index.html");
}
}
);
But if you promisified it, there is no error callback function. Simply:
await copyFileAsync(
"./index.html",
fs.constants.R_OK | fs.constants.W_OK
)
await fc("./index.html", "./dist/index.html");
and your try/catch will get the error.
Also with that particular try/catch return "Copied Index.html to /dist!";
is always returned, even if there is an error so I suggest making two return statements, one inside the try
and one inside the catch
or use a finally
if it doesn't matter.
Upvotes: 1