Having an issue while trying to compile a React app. After pulling the repo from Github, running yarn install, and then compiling it, I encountered the following error:
Module build failed (from ./node_modules/babel-loader/lib/index.js)
SyntaxError: {file_path_here}: Unexpected character ' '
The error is specifically in the file where the function renderItem is located.
export type DisplayItemT = {
mainText: string;
secondaryText: string[];
};
function renderItemsAsCards(items, options): string {
let cardsrows_mso = '';
for (let i = 0; i < items.length; ) {
let cards = '';
const record = items[i];
const item={mainText: record.get('name'),secondaryText: [record.get('department'), record.get('location')]};
const card = renderItem(item);
cards = cards.concat(card);
i++;
if( i === items.length) {
break;
}
cardsrows_mso = cards ? cardsrows_mso.concat(cards): ``;
}
return cardsrows_mso ? `
<table width="100%" border="0" style="text-align: ${options.align || 'left'};">
<tbody>
<tr>
${cardsrows_mso}
</tr>
</tbody>
</table>
`
:``;
}
function renderItem(item: DisplayItemT): string {
return `<td style="height: 100%; padding: 5px; width: 202px; max-width: 320px; min-width: 202px; display: inline-block;">
<div style="width: 100%; padding: 15px 0px 20px; text-align: center; border: 1px solid #cccccc; border-radius: 5px; height: 100%">
<h6 style="font-size: 15px; font-weight: 500; color: #333; line-height: 19px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; margin: 0;">${item.mainText}</h6>
<p style="font-size: 13px; line-height: 17px; color: #999; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;">${item.secondaryText[0]}</p>
<p style="font-size: 13px; line-height: 17px; color: #999; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;">${item.secondaryText[1]}</p>
</div>
</td>`;
}
Facing the aforementioned error with an unexpected character ' ' appearing at the end of parameter item within the line
function renderItem(item: DisplayItemT): string {It's worth noting that the function renderItem is kept separate for use in other files. Interestingly, when embedding the code from that function inside renderItemsAsCards which calls 'renderItem', the code compiles successfully.
Due to the complexity of my package.json and webpack.config.js files, feel free to ask if specific sections need to be shared. Any assistance on this matter would be greatly appreciated.