我尝试过类似的事情:
var path = '../right/here';
var module = require(path);
但它不能再以这种方式找到模块,而:
var module = require('../right/here');
就像一个魅力。想用生成的字符串列表加载模块,但我无法解决这个问题atm。有什么想法吗?
答案 0 :(得分:1)
这是由于Browserify如何进行捆绑,它只能对需求重新绑定进行静态字符串分析。因此,如果您想进行浏览器捆绑,则需要对您的要求进行硬编码。
对于必须进入生产部署的代码(与快速原型相反,您很少需要添加捆绑),始终建议坚持使用静态需求,部分原因在于捆绑,还因为使用动态字符串给你你的要求意味着你编写的代码是不可预测的,因此可能充满了你很少遇到的错误并且很难调试。
如果您需要基于不同运行的不同需求(例如,dev与阶段测试与生产相比),那么使用process.env
或配置对象通常是个好主意,以便在确定哪个时候库需要用于特定目的,您可以使用类似
var knox = config.offline ? require("./util/mocks3") : require("knox");
这样一来,如果发现错误,你的代码也会立即被其他需要追踪错误的人追踪。
答案 1 :(得分:1)
require('@/path/'.concat(fileName))
答案 2 :(得分:0)
您可以使用.require()添加要访问的文件来计算其路径,而不是在构建时静态,这样就会包含这些模块,并且稍后调用require()
时它们将是找到。
答案 3 :(得分:0)
您可以使用模板动态获取文件。
import React from 'react';
import { useParams } from 'react-router-dom';
import FakeData from '../FakeData/FakeData';
import Post from '../Post/Post';
const PostDetails = () => {
const {postIdNum} = useParams();
const postId = FakeData.find((pd) => pd.id === parseInt(postIdNum));
console.log('postId', postId);
console.log(Object.values(postIdNum));
return (
<div>
<h3>{postIdNum} no Post details</h3>
<Post posts={postId}></Post>
</div>
);
};
export default PostDetails;