如何在Laravel中将Vue.js切换到生产模式?

gpnt7bae  于 2023-03-03  发布在  Vue.js
关注(0)|答案(4)|浏览(425)

由于Vue.js已经安装在Laravel中,我不知道如何将其设置为生产模式。
当我启动我的网站时,我在控制台中收到消息:
您正在开发模式下运行Vue。请确保在部署用于生产时打开生产模式。

q5lcpyga

q5lcpyga1#

只需使用“npm run production”构建您的资产

qhhrdooz

qhhrdooz2#

方法一

  1. npm run production

方法2在Laravel中,在laravel配置中添加一个环境变量,并基于运行时加载Vue配置。
定义:MIX_ENV_MODE=production
用法:process.env.MIX_ENV_MODE
最后,将此代码添加到任何配置脚本文件中

  1. if (process.env.MIX_ENV_MODE === 'production') {
  2. Vue.config.devtools = false;
  3. Vue.config.debug = false;
  4. Vue.config.silent = true;
  5. }
hvvq6cgz

hvvq6cgz3#

在新版本之前设置手动app.js

  1. Vue.config.productionTip = true
  2. Vue.config.devtools = true;
  3. Vue.config.debug = true;
  4. Vue.config.silent = true;

使用npm生产/开发

  1. "npm run prod / production"
  2. "npm run dev / watch"
f1tvaqid

f1tvaqid4#

我将Vue2Laravel7一起使用,当我运行npm run prod时,得到错误FATAL ERROR: Ineffective mark-compacts near heap limit Allocation failed - JavaScript heap out of memory
这是全部误差。

  1. > @ prod /var/www/html/exptradies
  2. > npm run production
  3. > @ production /var/www/html/exptradies
  4. > cross-env NODE_ENV=production node_modules/webpack/bin/webpack.js --no-progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js
  5. <--- Last few GCs --->
  6. [3521:0x302b050] 110565 ms: Mark-sweep 489.2 (517.6) -> 485.0 (517.6) MB, 1150.6 / 0.0 ms (average mu = 0.155, current mu = 0.100) allocation failure scavenge might not succeed
  7. [3521:0x302b050] 111997 ms: Mark-sweep 489.2 (517.6) -> 485.0 (517.6) MB, 1222.8 / 0.0 ms (average mu = 0.150, current mu = 0.146) allocation failure scavenge might not succeed
  8. <--- JS stacktrace --->
  9. ==== JS stack trace =========================================
  10. Security context: 0x384b92cc08d1 <JSObject>
  11. 0: builtin exit frame: concat(this=0x0871a8909981 <JSArray[0]>,0x0871a8909961 <JSArray[0]>,0x0871a8909981 <JSArray[0]>)
  12. 1: /* anonymous */(aka /* anonymous */) [0x20144909fd61] [/var/www/html/exptradies/node_modules/terser-webpack-plugin/node_modules/terser/dist/bundle.min.js:~1] [pc=0x21c8562eee7d](this=0x349882d804b1 <undefined>,0x3c3d355838b9 <AST_Call map = 0x1ea8d45e1279>,0x0871a89...
  13. FATAL ERROR: Ineffective mark-compacts near heap limit Allocation failed - JavaScript heap out of memory
  14. 1: 0xa1ae50 node::Abort() [node]
  15. 2: 0xa1b25c node::OnFatalError(char const*, char const*) [node]
  16. 3: 0xb9b20e v8::Utils::ReportOOMFailure(v8::internal::Isolate*, char const*, bool) [node]
  17. 4: 0xb9b589 v8::internal::V8::FatalProcessOutOfMemory(v8::internal::Isolate*, char const*, bool) [node]
  18. 5: 0xd58815 [node]
  19. 6: 0xd58ea6 v8::internal::Heap::RecomputeLimits(v8::internal::GarbageCollector) [node]
  20. 7: 0xd65765 v8::internal::Heap::PerformGarbageCollection(v8::internal::GarbageCollector, v8::GCCallbackFlags) [node]
  21. 8: 0xd66615 v8::internal::Heap::CollectGarbage(v8::internal::AllocationSpace, v8::internal::GarbageCollectionReason, v8::GCCallbackFlags) [node]
  22. 9: 0xd690cc v8::internal::Heap::AllocateRawWithRetryOrFail(int, v8::internal::AllocationType, v8::internal::AllocationOrigin, v8::internal::AllocationAlignment) [node]
  23. 10: 0xd2f752 v8::internal::Factory::AllocateRawWithAllocationSite(v8::internal::Handle<v8::internal::Map>, v8::internal::AllocationType, v8::internal::Handle<v8::internal::AllocationSite>) [node]
  24. 11: 0xd3b104 v8::internal::Factory::NewJSArrayWithUnverifiedElements(v8::internal::Handle<v8::internal::FixedArrayBase>, v8::internal::ElementsKind, int, v8::internal::AllocationType) [node]
  25. 12: 0xd3b549 v8::internal::Factory::NewJSArray(v8::internal::ElementsKind, int, int, v8::internal::ArrayStorageAllocationMode, v8::internal::AllocationType) [node]
  26. 13: 0xec65c3 v8::internal::ElementsAccessor::Concat(v8::internal::Isolate*, v8::internal::Arguments*, unsigned int, unsigned int) [node]
  27. 14: 0xc0a565 [node]
  28. 15: 0xc12dfd v8::internal::Builtin_ArrayConcat(int, unsigned long*, v8::internal::Isolate*) [node]
  29. 16: 0x140e919 [node]
  30. npm ERR! code ELIFECYCLE
  31. npm ERR! errno 1
  32. npm ERR! @ production: `cross-env NODE_ENV=production node_modules/webpack/bin/webpack.js --no-progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js`
  33. npm ERR! Exit status 1
  34. npm ERR!
  35. npm ERR! Failed at the @ production script.
  36. npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
  37. npm ERR! A complete log of this run can be found in:
  38. npm ERR! /root/.npm/_logs/2023-03-02T16_32_12_621Z-debug.log
  39. npm ERR! code ELIFECYCLE
  40. npm ERR! errno 1
  41. npm ERR! @ prod: `npm run production`
  42. npm ERR! Exit status 1
  43. npm ERR!
  44. npm ERR! Failed at the @ prod script.
  45. npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
  46. npm ERR! A complete log of this run can be found in:
  47. npm ERR! /root/.npm/_logs/2023-03-02T16_32_12_662Z-debug.log

你知道为什么我会得到这个错误。

展开查看全部

相关问题