Reactjs：如何在生产应用程序的devtools中隐藏节点模块和webconfig？

Question

我已经创建了一个运行CREATE TABLE `student` ( `student_id` int(5) NOT NULL AUTO_INCREMENT, `student_first_name` varchar(30) not null, `student_lase_name` varchar(30) not null, `student_roll_no` int(5) not null, `student_class` int(2) not null, PRIMARY KEY (`student_id`) ); CREATE TABLE `result_sheet` ( `student_id` int(5), `student_first_name` varchar(30), `student_lase_name` varchar(30), `student_roll_no` int(5), `student_class` int(2), `mid_1_english` int(2), `mid_2_english` int(2), `mid_1_mathematics` int(2), `mid_2_mathematics` int(2), `mid_english` int(2), `mid_mathematics` int(2), `semester_final_english` int(2), `semester_final_mathematics` int(2), `total_english` int(2), `total_mathematics` int(2), `total` int(3), foreign key (student_id) references student(student_id) on delete cascade ); delimiter $$ create trigger result_sheet_insert_trigger after insert on student for each row begin insert into result_sheet(student_id, student_first_name, student_lase_name, student_roll_no, student_class, mid_1_english, mid_2_english, mid_1_mathematics, mid_2_mathematics, mid_english, mid_mathematics, semester_final_english, semester_final_mathematics, total_english, total_mathematics, total) values (new.student_id, new.student_first_name, new.student_lase_name, new.student_roll_no, new.student_class, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0); end$$ delimiter ; 的React.js应用程序，并且我不希望在生产模式下，整个项目在devtools中可用。

如何在“源”选项卡（devtools）中禁用或隐藏节点模块和webconfig？

我检查了其他部署的反应应用程序，它没有显示静态文件夹或整个项目;我怎样才能实现同样的目标？

下面是我浏览器控制台的截图＆＃34;来源＆＃34;选项卡，显示我想隐藏的一些目录;

Answer 1

GENERATE_SOURCEMAP=false react-scripts build

这不会在最终版本中生成源地图（.map）文件。

Answer 2

由于源映射文件，您在devtools中看到了完整的代码。这是在开发中调试代码的好方法，甚至是生产模式下的某些人。

如果没有源映射，当发生错误时，您无法轻易找到捆绑文件中此错误的来源。如果您不想在生产中看到这样的代码，您可以在构建后删除文件。删除static / css和static / js文件夹中的.map文件。因此，您可以隐藏非捆绑源代码。但是，捆绑的.js和.css文件将始终存在。没有办法隐藏它们，因为这是前端。

正如评论中所说，如果你的担心确实是一个安全问题，那么你就不能在前端做到这一点。你的代码总会被看到，至少它的缩小和丑化，但会有。所以，在后端做你的安全工作。

Answer 3

运行npm run build时，webpack会将所有js文件捆绑到一个主js文件中。生成构建后，您的开发文件，即es6中的代码响应将不会出现在build文件夹中。

Answer 4

只需运行

npm run build --nomaps