启动现有的 React 应用程序运行

Question

我正在尝试在我的 Mac 上本地获取一个已经存在的 React 应用程序运行ning。我有所有的源文件，并且在我的机器上安装了 node.js。

当我运行 npm install 时，我收到了一长串弃用和 npm 错误。一个列表，它的长度远远超过堆栈溢出字符限制。 是这样结束的。

npm ERR! 2 warnings generated.
npm ERR! In file included from ../src/libsass/src/util.cpp:3:
npm ERR! ../src/libsass/src/ast.hpp:1614:25: warning: loop variable 'numerator' creates a copy from type 'const std::__1::basic_string<char>' [-Wrange-loop-construct]
npm ERR!         for (const auto numerator : numerators)
npm ERR!                         ^
npm ERR! ../src/libsass/src/ast.hpp:1614:14: note: use reference type 'const std::__1::basic_string<char> &' to prevent copying
npm ERR!         for (const auto numerator : numerators)
npm ERR!              ^~~~~~~~~~~~~~~~~~~~~~
npm ERR!                         &
npm ERR! ../src/libsass/src/ast.hpp:1616:25: warning: loop variable 'denominator' creates a copy from type 'const std::__1::basic_string<char>' [-Wrange-loop-construct]
npm ERR!         for (const auto denominator : denominators)
npm ERR!                         ^
npm ERR! ../src/libsass/src/ast.hpp:1616:14: note: use reference type 'const std::__1::basic_string<char> &' to prevent copying
npm ERR!         for (const auto denominator : denominators)
npm ERR!              ^~~~~~~~~~~~~~~~~~~~~~~~
npm ERR!                         &
npm ERR! 2 warnings generated.
npm ERR! In file included from ../src/libsass/src/values.cpp:3:
npm ERR! In file included from ../src/libsass/src/values.hpp:4:
npm ERR! ../src/libsass/src/ast.hpp:1614:25: warning: loop variable 'numerator' creates a copy from type 'const std::__1::basic_string<char>' [-Wrange-loop-construct]
npm ERR!         for (const auto numerator : numerators)
npm ERR!                         ^
npm ERR! ../src/libsass/src/ast.hpp:1614:14: note: use reference type 'const std::__1::basic_string<char> &' to prevent copying
npm ERR!         for (const auto numerator : numerators)
npm ERR!              ^~~~~~~~~~~~~~~~~~~~~~
npm ERR!                         &
npm ERR! ../src/libsass/src/ast.hpp:1616:25: warning: loop variable 'denominator' creates a copy from type 'const std::__1::basic_string<char>' [-Wrange-loop-construct]
npm ERR!         for (const auto denominator : denominators)
npm ERR!                         ^
npm ERR! ../src/libsass/src/ast.hpp:1616:14: note: use reference type 'const std::__1::basic_string<char> &' to prevent copying
npm ERR!         for (const auto denominator : denominators)
npm ERR!              ^~~~~~~~~~~~~~~~~~~~~~~~
npm ERR!                         &
npm ERR! 2 warnings generated.
npm ERR! In file included from ../src/binding.cpp:1:
npm ERR! In file included from ../../nan/nan.h:58:
npm ERR! In file included from /Users/USER/.node-gyp/16.13.1/include/node/node.h:63:
npm ERR! In file included from /Users/USER/.node-gyp/16.13.1/include/node/v8.h:30:
npm ERR! /Users/USER/.node-gyp/16.13.1/include/node/v8-internal.h:492:38: error: no template named 'remove_cv_t' in namespace 'std'; did you mean 'remove_cv'?
npm ERR!             !std::is_same<Data, std::remove_cv_t<T>>::value>::Perform(data);
npm ERR!                                 ~~~~~^~~~~~~~~~~
npm ERR!                                      remove_cv
npm ERR! /Library/Developer/CommandLineTools/SDKs/MacOSX.sdk/usr/include/c++/v1/type_traits:776:50: note: 'remove_cv' declared here
npm ERR! template <class _Tp> struct _LIBCPP_TEMPLATE_VIS remove_cv
npm ERR!                                                  ^
npm ERR! 1 error generated.
npm ERR! make: *** [Release/obj.target/binding/src/binding.o] Error 1
npm ERR! gyp ERR! build error 
npm ERR! gyp ERR! stack Error: `make` failed with exit code: 2
npm ERR! gyp ERR! stack     at ChildProcess.onExit (/Users/USER/Desktop/it-cc/node_modules/node-gyp/lib/build.js:262:23)
npm ERR! gyp ERR! stack     at ChildProcess.emit (node:events:390:28)
npm ERR! gyp ERR! stack     at Process.ChildProcess._handle.onexit (node:internal/child_process:290:12)
npm ERR! gyp ERR! System Darwin 20.6.0
npm ERR! gyp ERR! command "/usr/local/bin/node" "/Users/USER/Desktop/it-cc/node_modules/node-gyp/bin/node-gyp.js" "rebuild" "--verbose" "--libsass_ext=" "--libsass_cflags=" "--libsass_ldflags=" "--libsass_library="
npm ERR! gyp ERR! cwd /Users/USER/Desktop/it-cc/node_modules/node-sass
npm ERR! gyp ERR! node -v v16.13.1
npm ERR! gyp ERR! node-gyp -v v3.8.0
npm ERR! gyp ERR! not ok 
npm ERR! Build failed with error code: 1

我尝试了以下方法：

确保删除所有锁定文件和 node_module 目录
已通过 npm cache clear --force
npm audit fix

我对 React 有点菜鸟，非常感谢任何帮助！

package.json内容：

{
  "name": "marketing-roi",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "@material-ui/core": "^4.10.0",
    "@testing-library/jest-dom": "^4.2.4",
    "@testing-library/react": "^9.5.0",
    "@testing-library/user-event": "^7.2.1",
    "node-sass": "^4.14.1",
    "react": "^16.13.1",
    "react-dom": "^16.13.1",
    "react-redux": "^7.2.0",
    "react-scripts": "3.4.1",
    "redux": "^4.0.5",
    "redux-thunk": "^2.3.0"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },
  "eslintConfig": {
    "extends": "react-app"
  },
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  }
}

Answer 1

答案是在我的 package.json 文件中将 node-sass 替换为 sass，并将版本编辑为有效版本（在我的例子中，我选择了最新版本 1.47.0 ).

我是运行我机器上的当前节点版本，并且指定了一个旧版本 node-sass，自应用程序构建以来，我的 package.json 文件不再支持该旧版本几年前。 Deprecation Announcement

感谢@Jared Smith

启动现有的 React 应用程序运行

Getting an existing React App up and running

javascript

node.js

npm

reactjs

启动现有的 React 应用程序 运行

Getting an existing React App up and running

javascript

node.js

npm

reactjs

启动现有的 React 应用程序运行