如何使用create-react-app运行构建版本？（create react app）

25-01-26 21

在本文中，我们将详细介绍如何使用create-react-app运行构建版本？的各个方面，并为您提供关于createreactapp的相关解答，同时，我们也将为您带来关于1.使用create-reac

在本文中，我们将详细介绍如何使用create-react-app运行构建版本？的各个方面，并为您提供关于create react app的相关解答，同时，我们也将为您带来关于1. 使用create-react-app创建react项目、create-react-app ：无法加载文件 C:\Users\Administrator\AppData\Roaming\npm\create-react-app.ps1，因为在此系统上禁止运行、create-react-app构建的react项目中使用mobx会出现修饰器警告、npm在create-react-app上运行构建ERR errno 134的有用知识。

本文目录一览：

如何使用create-react-app运行构建版本？（create react app）
1. 使用create-react-app创建react项目
create-react-app ：无法加载文件 C:\Users\Administrator\AppData\Roaming\npm\create-react-app.ps1，因为在此系统上禁止运行
create-react-app构建的react项目中使用mobx会出现修饰器警告
npm在create-react-app上运行构建ERR errno 134

如何使用create-react-app运行构建版本？（create react app）

因此，我使用create-react-app开发了一个小型React应用程序。（我总是从头开始编写应用程序。）

然后，在对它感到满意之后，我决定npm run build开始进行优化的生产。

有人可以告诉我如何运行生产版本而不是Dev版本吗？

答案1

小编典典

当您运行npm run build控制台时，实际上应该说以下内容

The build folder is ready to be deployed.You may serve it with a static server:npm install -g serveserve -s build

构建脚本会将您的整个应用程序构建到build文件夹中，以供静态使用。但是实际上为它提供服务需要某种静态文件服务器，例如他们建议的那种。

运行命令后，serve -s build您可以在本地主机（在指定端口上）访问生产版本。

您当然可以运行任何您喜欢的静态文件服务器，我通常为此使用express，但是，这serve似乎是仅用一个命令即可提供静态文件的最简单选项。

1. 使用create-react-app创建react项目

create-react-app

全局安装create-react-app

npm install -g create-react-app

使用create-react-app创建一个项目

$ create-react-app your-app 注意命名方式

Creating a new React app in /dir/your-app.

Installing packages. This might take a couple of minutes. 安装过程较慢，
Installing react, react-dom, and react-scripts...

如果不想全局安装，可以直接使用npx

$ npx create-react-app your-app    也可以实现相同的效果

这需要等待一段时间，这个过程实际上会安装三个东西

react: react的顶级库
react-dom: 因为react有很多的运行环境，比如app端的react-native, 我们要在web上运行就使用react-dom
react-scripts: 包含运行和打包react应用程序的所有脚本及配置

出现下面的界面，表示创建项目成功:

Success! Created your-app at /dir/your-app
Inside that directory, you can run several commands:

  npm start
    Starts the development server.

  npm run build
    Bundles the app into static files for production.

  npm test
    Starts the test runner.

  npm run eject
    Removes this tool and copies build dependencies, configuration files
    and scripts into the app directory. If you do this, you can’t go back!

We suggest that you begin by typing:

  cd your-app
  npm start

Happy hacking!

根据上面的提示，通过cd your-app命令进入目录并运行npm start即可运行项目。
生成项目的目录结构如下：

├── README.md                            使用方法的文档
├── node_modules                    所有的依赖安装的目录
├── package-lock.json            锁定安装时的包的版本号,保证团队的依赖能保证一致。
├── package.json                    
├── public                                静态公共目录
└── src                                        开发用的源代码目录

代码的入口是项目目录下的index.js

$create-react-app ：无法加载文件 C:\Users\Administrator\AppData\Roaming\npm\create-react-app.ps1，因为在此系统上禁止运行$

create-react-app ：无法加载文件 C:\Users\Administrator\AppData\Roaming\npm\create-react-app.ps1，因为在此系统上禁止运行

创建 react 项目时报了这个错误，今天终于找到了错误，记下来免得以后忘记。

我不想把项目放在 C 盘，所以我是放在别的盘的。就在你想放的盘里建好文件夹，然后 shift + 鼠标右键 >>> 在此处打开 Powershell 窗口，然后输入命令行就行啦。

错误提示如下：

解决方法如下：

1、搜索框输入：Windos PowerShell 并且以右键管理员身份运行

2、打开了命令行之后，输入 set-ExecutionPolicy RemoteSigned，并且把权限改权限为 A，然后通过 get-ExecutionPolicy 查看当前的状态：

3、最后我们就可以使用命令创建项目了。

create-react-app构建的react项目中使用mobx会出现修饰器警告

解决办法

命令行输入：npm run eject

修改package.json文件中babel配置：
"babel": {

   "presets": [
     "react-app"
   ],
   "plugins":[
     [
       "@babel/plugin-proposal-decorators",
       {
         "legacy":true
       }
     ],
     [
       "@babel/plugin-proposal-class-properties",
       {
         "loose":true
       }
     ]
   ]
}

npm在create-react-app上运行构建ERR errno 134

如何解决npm在create-react-app上运行构建ERR errno 134？

我使用create-react-app创建了一个应用程序，并使用Ubuntu 18.04.3将其部署到Digital Ocean Droplet中

使用节点v13.14.0 npm 6.14.6

我运行了导出NODE_OPTIONS =“-max-old-space-size = 8192”

现在，当我尝试npm run build时，我得到errno134。日志不是那么具有描述性

0 info it worked if it ends with ok
1 verbose cli [ ''/usr/local/bin/node'',''/usr/local/bin/npm'',''run'',''build'' ]
2 info using npm@6.14.6
3 info using node@v12.18.3
4 verbose run-script [ ''prebuild'',''build'',''postbuild'' ]
5 info lifecycle myapp@0.1.0~prebuild: myapp@0.1.0
6 info lifecycle myapp@0.1.0~build: myapp@0.1.0
7 verbose lifecycle myapp@0.1.0~build: unsafe-perm in lifecycle true
8 verbose lifecycle myapp@0.1.0~build: PATH: /usr/local/lib/node_modules/npm$
9 verbose lifecycle myapp@0.1.0~build: CWD: /home/david/myapp
10 silly lifecycle myapp@0.1.0~build: Args: [ ''-c'',''node scripts/build.js'' ]
11 silly lifecycle myapp@0.1.0~build: Returned: code: 134  signal: null
12 info lifecycle myapp@0.1.0~build: Failed to exec build script
13 verbose stack     at maybeClose (internal/child_process.js:1021:16)
13 verbose stack     at Process.ChildProcess._handle.onexit (internal/child_pro$
14 verbose pkgid myapp@0.1.0
15 verbose cwd /home/david/myapp
16 verbose Linux 4.15.0-112-generic
17 verbose argv "/usr/local/bin/node" "/usr/local/bin/npm" "run" "build"
18 verbose node v12.18.3
19 verbose npm  v6.14.6
20 error code ELIFECYCLE
21 error errno 134
22 error myapp@0.1.0 build: `node scripts/build.js`
22 error Exit status 134
23 error Failed at the myapp@0.1.0 build script.
23 error This is probably not a problem with npm. There is likely additional lo$
24 verbose exit [ 134,true ]

我有这个堆栈跟踪：

==== JS stack trace =========================================

    0: ExitFrame [pc: 0x13cf019]
    1: StubFrame [pc: 0x1355ea1]
Security context: 0x2a40369408d1 <JSObject>
    2: _replaceInStringNode [0x1687370870e9] [/home/david/myapp/node_modules/webpack-sources/lib/ReplaceSource.js:~194] [pc=0x2c71cda9f975](this=0x035173805049 <Source map = 0x336c4ecf7cf9>,0x01fcf43b97f1 <JSArray[309]>,0x01fcf43b97a1 <ReplacementEnumerator map = 0x13294d6fe199>,0x01fcf43ba361 <JSFunction getoriginalSource (sfi...

Fatal error: Ineffective mark-compacts near heap limit Allocation Failed - JavaScript heap out of memory
 1: 0xa093f0 node::Abort() [node]
 2: 0xa097fc node::OnFatalError(char const*,char const*) [node]
 3: 0xb842ae v8::Utils::ReportOOMFailure(v8::internal::Isolate*,char const*,bool) [node]
 4: 0xb84629 v8::internal::V8::FatalProcessOutOfMemory(v8::internal::Isolate*,bool) [node]
 5: 0xd30fe5  [node]
 6: 0xd31676 v8::internal::Heap::RecomputeLimits(v8::internal::GarbageCollector) [node]
 7: 0xd3def5 v8::internal::Heap::PerformGarbageCollection(v8::internal::GarbageCollector,v8::GCCallbackFlags) [node]
 8: 0xd3eda5 v8::internal::Heap::CollectGarbage(v8::internal::AllocationSpace,v8::internal::GarbageCollectionReason,v8::GCCallbackFlags) [node]
 9: 0xd4185c v8::internal::Heap::AllocaterawWithRetryOrFail(int,v8::internal::AllocationType,v8::internal::Allocationorigin,v8::internal::AllocationAlignment) [node]
10: 0xd0830b v8::internal::Factory::NewFillerObject(int,bool,v8::internal::Allocationorigin) [node]
11: 0x1049f4e v8::internal::Runtime_AllocateInYoungGeneration(int,unsigned long*,v8::internal::Isolate*) [node]
12: 0x13cf019  [node]
Aborted (core dumped)

在我的本地环境中可以正常工作吗？

我尝试降级节点，但它给了我137错误。似乎是内存问题，但是我应该有足够的内存吗？当我恢复到可以正常工作的仓库的先前版本时，它也无法构建？

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）

今天的关于如何使用create-react-app运行构建版本？和create react app的分享已经结束，谢谢您的关注，如果想了解更多关于1. 使用create-react-app创建react项目、create-react-app ：无法加载文件 C:\Users\Administrator\AppData\Roaming\npm\create-react-app.ps1，因为在此系统上禁止运行、create-react-app构建的react项目中使用mobx会出现修饰器警告、npm在create-react-app上运行构建ERR errno 134的相关知识，请在本站进行查询。

本文标签：