requier的问题

Question

最近在看哪个慕课的哪个画廊的课程，因为感觉里面的都比较的老了，就自己基于creat-react-app来写，然后requier文件的时候遇到一个问题

// 获取画廊数据
const imgData = require('./data/gallery_data.json');
// 图片所在文件夹
const imgDirectory = "./img/gallery_img/";
// 获取图片的Url
const galleryImgs = (function getImgUrl(imgDataArr) {
for (let i = 0, j = imgDataArr.length; i < j; i++) {
var imgUrl = imgDataArr[i];
imgUrl.imgUrl = require('./img/gallery_img/' + imgDataArr[i].fileName);
imgDataArr[i] = imgUrl;
}
return imgDataArr;
}(imgData))

如果我把里面的 ./img/gallery_img/ 改成自己定义的变量就会进行报错，这个是为什么？

Answer 1

Rosen 2018-03-18 22:34:46

这个目录位置和图片文件的位置应该是对应的，只改这个变量不改目录结构应该就报错了

• 提问者 李行知 #1

  并不是修改了变量，而是
  // imgUrl.imgUrl = require('./img/gallery_img/' + imgDataArr[i].fileName);
      imgUrl.imgUrl = require(imgDirectory + imgDataArr[i].fileName);
      
  这个时候就会有报错，说can`t find module .

• Rosen #2

  看下你加出来的是什么东西，或者报错里的路径检查下哪出问题了

• 提问者 李行知 回复 Rosen #3

  老师你看下我另外一个回答，这里面不能截图

点开查看后面3条评论

Answer 2

提问者 李行知 2018-03-21 23:38:08

最后发现requier不能直接解析变量

imgUrl.imgUrl = require(''+imgDirectory + imgDataArr[i].fileName);//可以

这样就好了

Answer 3

提问者 李行知 2018-03-20 09:40:49

此时代码为

// 获取画廊数据
const imgData = require('./data/gallery_data.json');
// 图片所在文件夹
const imgDirectory = "./img/gallery_img/";
// 获取图片的Url
const galleryImgs = (function getImgUrl(imgDataArr) {
for (let i = 0, j = imgDataArr.length; i < j; i++) {
var imgUrl = imgDataArr[i];
// imgUrl.imgUrl = require('./img/gallery_img/' + imgDataArr[i].fileName);
imgUrl.imgUrl = require(imgDirectory + imgDataArr[i].fileName);
imgDataArr[i] = imgUrl;
}
return imgDataArr;
}(imgData))


console.log(galleryImgs);