问题标签 [react-scripts]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
django - 如何使用 webpack 将现有的 Django 应用程序与现有的反应应用程序连接起来
所以我有一个充当后端 REST 服务器的 Django 项目,我想将它与一个现有的 React 项目集成,该项目对该 REST 服务器进行 AJAX 调用。同样,这两个项目都已经存在,我只想将它们连接起来。假设我的 Django 项目的根是 DJANGOROOT,这就是 manage.py 所在的位置。我的 Django 项目有几个 Django 应用程序是项目的一部分。假设我的 Django 项目名为“mydjangoproj”,两个 Django 应用程序名为“myapp1”和“myapp2”,React 项目名为“myreactproj”。这两个项目中的每一个(带有两个应用程序的 Django 项目和 React 项目)都存储在一个单独的 GIT 存储库中,为了将它们连接到我的服务器上,我有以下目录结构:
请注意,React 应用程序根文件夹位于 DJANGOROOT 内,并且与我的 django 项目和应用程序文件夹平行。
React 应用程序使用一个名为 react-scripts 的 npm 模块(请参阅https://github.com/facebook/create-react-app/blob/master/packages/react-scripts/template/README.md#npm-run-build ) 有一个构建脚本,它将构建 DJANGOROOT/myreactproj/src 中的所有内容(以 index.js 为目标),并将所有这些内容放在一个名为 DJANGOROOT/myreactproj/build 的文件夹中。当我运行构建(使用“npm run build”)时,它会填充文件夹 DJANGOROOT/myreactproj/build,如下所示:
所以看来,要将 Django 连接到我的 React 应用程序,我必须找到一种方法让 Django (mydomain.com/) 的根路径指向 DJANGOROOT/myreactproj/build/index.html。我知道我必须创建一个由运行在 mydomain.com/ 的 Django 视图启动的“主页”模板,并且该主页模板必须启动 React 应用程序,如下所示:
但是我不确定我需要如何告诉 Django 在哪里寻找 main.js(或者是 index.js),并且我不确定如何让 Django 查看 DJANGOROOT/myreactproj/build 中的所有静态内容/静止的。
我还在 DJANGOROOT/myreactproj 中运行了“npm list webpack”来获取 webpack 的版本,它显示了这个:
我认为这意味着 webpack 3.5.1 正在被使用,并且以某种方式与 react-scripts v 1.0.11 捆绑在一起
另请注意,Django 应用程序已经在 NGINX 和 UWSGI 下的 HTTPS 下运行,因此这是一个真正的服务器而不是开发服务器。
经历过这个过程的人能否阐明我需要做些什么才能正确连接这一切?
reactjs - React:脚本验证
所以我有一个渲染两个 360 图像的组件。该组件几乎完成了,但还有两件事要完成,我无法理解。
所以这里是挂载脚本的代码块:
这就是我渲染它们的方式:
所以我想做的是以下。我有一个子组件,我在其中播放加载动画。所以我想简单地检查两个脚本是否正确安装并删除加载动画。我怎么做??这甚至是在您的反应应用程序中调用脚本的好方法吗?
reactjs - 使用 pm2 在服务器上运行 React 构建
我已经编译了我的反应应用程序
它在 App 的根目录下生成了一个 build\ 文件夹。我正在运行 build\ 文件夹使用
自从我通过-T
. 但是我需要使用任何可用的模块来永远运行我的应用程序。我一直在研究节点模块和pm2。我正在尝试通过以下方式使用 pm2:
它抛出:
当我使用时:
它适用于控制台,但我无法从 URL 访问我的应用程序
有人可以帮我弄这个吗?或者,如果有任何其他方式可以永远在生产环境中运行您的 react 应用程序。
javascript - react-scripts build then serve 提供 html,而不是 main.js 文件
我正在使用react-scripts
并成功运行npm run build
以生成build
文件夹。
然后我通过运行serve -s build
.
serve
然后在端口 5000 上运行,这很好。
当我去访问页面时localhost:5000
,页面就停止了,控制台中出现以下错误main.975cb3de.js:1 Uncaught SyntaxError: Unexpected token <
。
我main.975cb3de.js
在控制台中打开文件,它正在尝试提供index.html
文件。
如果我清空浏览器缓存并重新加载页面,那么它加载正常。每次我运行构建时都会发生这种情况。
我怀疑库中有配置,serve
但不太确定。
关于它为什么第一次尝试提供 HTML 以及如何解决这个问题的任何想法?
reactjs - 构建应用程序后创建反应应用程序配置文件
我想要在构建后根文件夹中的配置文件(JSON)来配置我的应用程序。
喜欢Translation
和API Urls
...
我可以通过创建反应应用程序来做到这一点吗?
reactjs - create-react-app 2.0,如何在 sass/scss 文件中使用绝对路径导入?
我正在使用creacte-react-app 2.0.0-next.66cc7a90,它已经支持 Sass/Scss 文件
但是在 Sass/Scss 文件中使用默认的相对导入,我必须使用类似的代码
@import "../../../../../styles/variables/_variables.scss";
相反,我想使用绝对导入,所以我可以使用代码导入
@import "styles/variables/_variables.scss";
我知道实现的一种方法是更新选项
但我想在不弹出的情况下做到这一点,我该怎么做?使用react-app-rewired?
javascript - 使用 ES6 编写的 npm 模块和 react-scripts
在我的项目中,我需要将 npm 模块ipfs-api与create-react-app
.
我可以运行npm start
并运行该项目。
但是当我尝试用 构建项目时react-scripts build
,它会引发以下错误
编译失败。
无法缩小此文件中的代码:
./node_modules/ipfs-api/src/utils/module-config.js:7
根据错误日志中提供的链接中的建议,我尝试使用,
而不是"ipfs-api": "^22.0.0",
. 虽然这解决了 的错误ipfs-api
,但其他依赖模块(可能与 一起安装ipfsapi
)不断给出相同类型的Failed to minify
错误,我停止手动编译它们。
在使用命令之前,有没有办法将所有依赖节点模块转换为 es5 react-scripts build
?或者有什么其他方法可以解决这个问题?
reactjs - 'react-scripts start' 命令到底是什么?
我一直在使用 React 项目create-react-app
,我有两个选项来启动项目:
第一种方式:
npm run start
定义package.json
如下:
"start": "react-scripts start",
第二种方式:
npm start
这两个命令有什么区别?而且, 的目的是react-scripts start
什么?
我试图找到定义,但我刚刚找到了一个具有此名称的包。我还是不知道这个命令有什么用?
create-react-app - 带有 react-scripts@next 和 css 模块的故事书
我尝试了 react-scripts@next 2.0.0-next.66cc7a90
(create-react-app v2),因为添加了对 css 模块的支持。不幸的是,故事书忽略了 css 模块。我可以做任何快速修复吗?
reactjs - 什么是用于快照测试的 react-scripts Jest 默认序列化程序?
我发现的唯一信息在此链接中:
可以通过将以下任何受支持的键添加到 package.json 中的 Jest 配置来覆盖默认的 Jest 覆盖配置。
支持的覆盖:
- collectCoverageFrom
- 报道记者
- 覆盖阈值
- 快照序列化器
在 mynode_modules/react-scripts/utils/createJestConfig.js
中,开玩笑的配置对象没有snapshotSerializers
默认属性。我在 CRA 的用户指南的其他任何地方都没有找到有关此的信息,也没有在已关闭的问题中找到。
默认的序列化器是什么?