[英]react-boilerplate Error: Can't resolve '../xlsx' in '/Users/react-boilerplate/node_modules/xlsx-style'
I am using react-boilerplate when I do run npm install I see these errors我在运行npm install时正在使用 react-boilerplate 我看到这些错误
Building the Webpack DLL... Hash: 7f68501fbcd6b8f05530 Version: webpack 4.12.0 Time: 3566ms Built at: 08/05/2018 6:10:17 PM Asset Size Chunks Chunk Names reactBoilerplateDeps.dll.js 4.81 MiB reactBoilerplateDeps [emitted] [big] reactBoilerplateDeps chunk {reactBoilerplateDeps} reactBoilerplateDeps.dll.js (reactBoilerplateDeps) 4.15 MiB [entry] [rendered] WARNING in ./node_modules/xlsx-style/ods.js Module not found: Error: Can't resolve '../xlsx' in '/Users/mehrnooshhajkhalil/react-boilerplate/node_modules/xlsx-style' @ ./node_modules/xlsx-style/ods.js @ ./node_modules/xlsx-style/xlsx.js @ ./node_modules/node-excel-export/lib/excel.js @ ./node_modules/node-excel-export/index.js @ dll reactBoilerplateDeps ERROR in ./node_modules/xlsx-style/dist/cpexcel.js Module not found: Error: Can't resolve './cptable' in '/Users/mehrnooshhajkhalil/react-boilerplate/node_modules/xlsx-style/dist' @ ./node_modules/xlsx-style/dist/cpexcel.js 807:16-41 @ ./node_modules/xlsx-style/xlsx.js @ ./node_modules/node-excel-export/lib/excel.js @ ./node_modules/node-excel-export/index.js @ dll reactBoilerplateDeps ERROR in ./node_modules/xlsx-style/xlsx.js Module not found: Error: Can't resolve 'fs' in '/Users/mehrnooshhajkhalil/react-boilerplate/node_modules/xlsx-style' @ ./node_modules/xlsx-style/xlsx.js 1204:27-40 1340:8-24 @ ./node_modules/node-excel-export/lib/excel.js @ ./node_modules/node-excel-export/index.js @ dll reactBoilerplateDeps ERROR in ./node_modules/xlsx-style/ods.js Module not found: Error: Can't resolve 'fs' in '/Users/mehrnooshhajkhalil/react-boilerplate/node_modules/xlsx-style' @ ./node_modules/xlsx-style/ods.js 58:8-24 @ ./node_modules/xlsx-style/xlsx.js @ ./node_modules/node-excel-export/lib/excel.js @ ./node_modules/node-excel-export/index.js @ dll reactBoilerplateDeps ERROR in ./node_modules/xlsx-style/ods.js Module not found: Error: Can't resolve 'xlsx' in '/Users/mehrnooshhajkhalil/react-boilerplate/node_modules/xlsx-style' @ ./node_modules/xlsx-style/ods.js 13:21-41 @ ./node_modules/xlsx-style/xlsx.js @ ./node_modules/node-excel-export/lib/excel.js @ ./node_modules/node-excel-export/index.js @ dll reactBoilerplateDeps removed 1 package and audited 53190 packages in 30.134s
I did also try我也试过
rm -rf node-modules npm clean cache --force npm install rm -rf node-modules npm clean cache --force npm install
But none of them did not solve my problem但他们都没有解决我的问题
Node version : v10.8.0 npm version : 6.2.0节点版本:v10.8.0 npm 版本:6.2.0
我使用yarn add xlsx --save
下载了 xlsx 模块并解决了问题。
I've read tons of related topics and tried everything.我已经阅读了大量相关主题并尝试了一切。 But in my case this helped: In Webpack config in externals
replace { "../xlsx.js": "var _XLSX" }
with { "../xlsx": "var _XLSX" }
但就我而言,这有帮助:在externals
Webpack 配置中,将{ "../xlsx.js": "var _XLSX" }
替换为{ "../xlsx": "var _XLSX" }
I was stuck in this issue like 1 week, The problem is when you want to use any package that are using export excel, they are using fs is short for file system.我被困在这个问题上 1 周,问题是当你想使用任何使用 export excel 的包时,他们使用 fs 是文件系统的缩写。 A browser doesn't have any.浏览器没有。
Therefore, it is almost impossible export an excel file from reactboilerplate in front end, I did handle it by using node-excel-export then write an API for that like this:因此,几乎不可能从前端的 reactboilerplate 导出 excel 文件,我确实通过使用 node-excel-export 来处理它,然后为此编写一个 API:
export const exportIssues = (req, res) => { const styles = { headerDark: { fill: { fgColor: { rgb: 'FF000000' } }, font: { color: { rgb: 'FFFFFFFF' }, sz: 14, bold: true, underline: true } } }; //Here you specify the export structure const issueSpecification = { HousingManager: { // <- the key should match the actual data key displayName: 'Housing manager', // <- Here you specify the column header headerStyle: styles.headerDark, // <- Header style width: 120 // <- width in pixels }, CompanyName: { // <- the key should match the actual data key displayName: 'Company name', // <- Here you specify the column header headerStyle: styles.headerDark, // <- Header style width: 120 // <- width in pixels }, HousingManagerEmail: { // <- the key should match the actual data key displayName: 'Housing manager email', // <- Here you specify the column header headerStyle: styles.headerDark, // <- Header style width: 120 // <- width in pixels } } const issueData = [ {HousingManager:'sss', CompanyName: 'xxx' , HousingManagerEmail:'xx@x.com'}, {HousingManager:'sss', CompanyName: 'xxx' , HousingManagerEmail:'xx@x.com'}, ] const report = excel.buildExport( [ // <- Notice that this is an array. Pass multiple sheets to create multi sheet report { name: 'Issues', // <- Specify sheet name (optional) specification: issueSpecification, // <- Report specification data: issueData // <-- Report data } ] ); // You can then return this straight res.set("Content-Disposition", "attachment;filename=report.xlsx"); res.set("Content-type", "application/vnd.ms-excel") res.attachment('report.xlsx'); // This is sails.js specific (in general you need to set headers) return res.send(report); };
Then call this function in frontend:然后在前端调用这个函数:
exportIssues = (e) =>{
axios.get('APIURL',{
responseType: 'blob',
})
.then((response) => {
download(response.data, "Issues.xlsx", "application/vnd.ms-excel");
})
};
I have found the solutions.我已经找到了解决方案。
Please replace the following code in ods.js请替换ods.js中的以下代码
if(typeof XLSX !== 'undefined') return XLSX.utils;
if(typeof module !== "undefined" && typeof require !== 'undefined')
{
try
{
return require('./' + 'xlsx').utils;
}
catch(e)
{
try
{
return require('./' + 'xlsx').utils;
}
catch(ee)
{
return require('./xlsx').utils;
}
}
throw new Error("Cannot find XLSX utils");
};
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.