第一次使用Nuxt,環境都沒有搭起來,各種報錯。
其中一次提示如下信息:
Error: EPERM: operation not permitted
意思是權限不被允許。我用了幾種方法都不行,目前這種方法有點反應了,便記錄下來。
解決辦法是如下:
1.刪除項目根目錄下的package-lock.json文件(不確定不刪除是否可以);
2.刪除node_modules文件夾
2.打開終端,運行npm cache clean --force;
3.在終端中執行cnpm install;
第一次執行cnpm install依然有問題,沒看懂什么意思
第二次執行cnpm install貌似問題解決了
如下圖所示(紅色為執行過的命令,品紅色成功提示):
Windows PowerShell 版權所有 (C) Microsoft Corporation。保留所有權利。 嘗試新的跨平台 PowerShell https://aka.ms/pscore6 PS D:\heima\guili_vue\vue-admin-front-nuxt> npm cache clean --force npm WARN using --force I sure hope you know what you are doing. PS D:\heima\guili_vue\vue-admin-front-nuxt> cnpm install \ [1/7] Installing signal-exit@^3.0.2platform unsupported nuxt@2.14.3 › @nuxt/builder@2.14.3 › chokidar@3.4.2 › fsevents@~2.1.2 Package require os(darwin) not compatible with your platform(win32) | [1/7] Installing statuses@~1.5.0[fsevents@~2.1.2] optional install error: Package require os(darwin) not compatible with your platform(win32) - [6/7] Installing randombytes@^2.0.0 WARN node unsupported "node@v14.0.0" is incompatible with nuxt@2.14.3 › @nuxt/webpack@2.14.3 › babel-loader@8.1.0 › webpack@4.44.1 › watchpack@1.7.4 › watchpack-chokidar2@^2.0.0, expected node@<8.10.0 | [6/7] Installing randombytes@^2.0.1platform unsupported nuxt@2.14.3 › @nuxt/webpack@2.14.3 › babel-loader@8.1.0 › webpack@4.44.1 › watchpack@1.7.4 › watchpack-chokidar2@2.0.0 › chokidar@2.1.8 › fsevents@^1.2.7 Package require os(darwin) not compatible with your platform(win32) / [6/7] Installing safe-buffer@^5.0.1[fsevents@^1.2.7] optional install error: Package require os(darwin) not compatible with your platform(win32) √ Installed 7 packages √ Linked 933 latest versions [1/3] scripts.postinstall nuxt@2.14.3 › @nuxt/webpack@2.14.3 › webpack-bundle-analyzer@3.8.0 › ejs@^2.6.1 run "node ./postinstall.js", root: "D:\\heima\\guili_vue\\vue-admin-front-nuxt\\node_modules\\_ejs@2.7.4@ejs" Thank you for installing EJS: built with the Jake JavaScript build tool (https://jakejs.com/) [1/3] scripts.postinstall nuxt@2.14.3 › @nuxt/webpack@2.14.3 › webpack-bundle-analyzer@3.8.0 › ejs@^2.6.1 finished in 126ms [2/3] scripts.postinstall nuxt@2.14.3 › @nuxt/webpack@2.14.3 › @nuxt/babel-preset-app@2.14.3 › core-js@^2.6.5 run "node -e \"try{require('./postinstall')}catch(e){}\"", root: "D:\\heima\\guili_vue\\vue-admin-front-nuxt\\node_modules\\_core-js@2.6.11@core-js" Thank you for using core-js ( https://github.com/zloirock/core-js ) for polyfilling JavaScript standard library! The project needs your help! Please consider supporting of core-js on Open Collective or Patreon: > https://opencollective.com/core-js > https://www.patreon.com/zloirock Also, the author of core-js ( https://github.com/zloirock ) is looking for a good job -) [2/3] scripts.postinstall nuxt@2.14.3 › @nuxt/webpack@2.14.3 › @nuxt/babel-preset-app@2.14.3 › core-js@^2.6.5 finished in 139ms [3/3] scripts.postinstall nuxt@^2.0.0 run "opencollective || exit 0", root: "D:\\heima\\guili_vue\\vue-admin-front-nuxt\\node_modules\\_nuxt@2.14.3@nuxt" :-: .==-+: .==. :+- .-=- .==. :==++-+=. :==. -**: :+=. :+- :*+++. .++. :+- -*= .++: .=+. -+: =*- .+*: .=+: -+: .=*- .=*- =+: .==: .+*: -*- -+- .=+:.....:+*-.........:=*=..=*- .-=------=++============++====: Thanks for installing nuxtjs Please consider donating to our open collective to help us maintain this package. Donate: https://opencollective.com/nuxtjs/donate [3/3] scripts.postinstall nuxt@^2.0.0 finished in 3s √ Run 3 scripts peerDependencies link ajv@5.5.2 in D:\heima\guili_vue\vue-admin-front-nuxt\node_modules\_ajv-keywords@2.1.1@ajv-keywords unmet with D:\heima\guili_vue\vue-admin-front-nuxt\node_modules\ajv(6.12.4) deprecate eslint@4.19.1 › file-entry-cache@2.0.0 › flat-cache@1.3.4 › circular-json@^0.3.1 CircularJSON is in maintenance only, flatted is its successor. deprecate nuxt@2.14.3 › @nuxt/webpack@2.14.3 › babel-loader@8.1.0 › webpack@4.44.1 › watchpack@1.7.4 › watchpack-chokidar2@2.0.0 › chokidar@^2.1.8 Chokidar 2 will break on node v14+. Upgrade to chokidar 3 with 15x less dependencies. deprecate nuxt@2.14.3 › @nuxt/webpack@2.14.3 › babel-loader@8.1.0 › webpack@4.44.1 › watchpack@1.7.4 › watchpack-chokidar2@2.0.0 › chokidar@2.1.8 › fsevents@^1.2.7 fsevents 1 will break on node v14+ and could be using insecure binaries. Upgrade to fsevents 2. resolve@0.5.3 › urix@^0.1.0 Please see https://github.com/lydell/urix#deprecated deprecate nuxt@2.14.3 › @nuxt/webpack@2.14.3 › babel-loader@8.1.0 › webpack@4.44.1 › micromatch@3.1.10 › braces@2.3.2 › snapdragon@0.8.2 › source-map-resolve@0.5.3 › resolve-url@^0.2.1 https://github.com/lydell/resolve-url#deprecated deprecate nuxt@2.14.3 › @nuxt/webpack@2.14.3 › @nuxt/babel-preset-app@2.14.3 › core-js@^2.6.5 core-js@<3 is no longer maintained and not recommended for usage due to the number of issues. Please, upgrade your dependencies to the actual version of core-js@3. Recently updated (since 2020-08-10): 22 packages (detail see file D:\heima\guili_vue\vue-admin-front-nuxt\node_modules\.recently_updates.txt) Today: → nuxt@^2.0.0(2.14.3) (01:04:22) → nuxt@2.14.3 › @nuxt/builder@2.14.3(2.14.3) (01:03:34) → nuxt@2.14.3 › @nuxt/generator@2.14.3(2.14.3) (01:03:51) → nuxt@2.14.3 › @nuxt/cli@2.14.3(2.14.3) (01:03:38) → nuxt@2.14.3 › @nuxt/core@2.14.3(2.14.3) (01:03:47) → nuxt@2.14.3 › @nuxt/webpack@2.14.3(2.14.3) (01:04:18) → nuxt@2.14.3 › @nuxt/builder@2.14.3 › @nuxt/utils@2.14.3(2.14.3) (01:04:04) → nuxt@2.14.3 › @nuxt/builder@2.14.3 › @nuxt/vue-app@2.14.3(2.14.3) (01:04:09) → nuxt@2.14.3 › @nuxt/cli@2.14.3 › @nuxt/config@2.14.3(2.14.3) (01:03:43) → nuxt@2.14.3 › @nuxt/core@2.14.3 › @nuxt/server@2.14.3(2.14.3) (01:03:55) → nuxt@2.14.3 › @nuxt/core@2.14.3 › @nuxt/vue-renderer@2.14.3(2.14.3) (01:04:13) → nuxt@2.14.3 › @nuxt/webpack@2.14.3 › @nuxt/babel-preset-app@2.14.3(2.14.3) (01:03:30) √ All packages installed (1097 packages installed from npm registry, used 17s(network 13s), speed 184.65kB/s, json 940(2.29MB), tarball 0B) PS D:\heima\guili_vue\vue-admin-front-nuxt> cnpm install √ Installed 7 packages √ Linked 0 latest versions √ Run 0 scripts √ All packages installed (used 13ms(network 9ms), speed 0B/s, json 0(0B), tarball 0B) PS D:\heima\guili_vue\vue-admin-front-nuxt>
緊接着我又執行了啟動命令
如下圖所示(紅色為執行過的命令,品紅色成功提示):
PS D:\heima\guili_vue\vue-admin-front-nuxt> npm run dev > guli@1.0.0 dev D:\heima\guili_vue\vue-admin-front-nuxt > nuxt i NuxtJS collects completely anonymous data about usage. 14:31:22 This will help us improving Nuxt developer experience over the time. Read more on https://git.io/nuxt-telemetry ? Are you interested in participation? Yes WARN Address localhost:3000 is already in use. 14:32:26 i Trying a random port... 14:32:26 ╭────────────────────────────────────────╮ │ │ │ Nuxt.js @ v2.14.3 │ │ │ │ ▸ Environment: development │ │ ▸ Rendering: server-side │ │ ▸ Target: server │ │ │ │ Listening: http://localhost:60774/ │ │ │ ╰────────────────────────────────────────╯ i Preparing project for development 14:32:27 i Initial build may take a while 14:32:27 √ Builder initialized 14:32:27 √ Nuxt files generated 14:32:27 √ Client Compiled successfully in 5.43s √ Server Compiled successfully in 5.03s i Waiting for file changes 14:32:35 i Memory usage: 204 MB (RSS: 275 MB) 14:32:35 i Listening on: http://localhost:60774/ 14:32:35 ERROR [Vue warn]: Property or method "name" is not defined on the instance but referenced during render. Make sure that this property is reactive, either in the data option, or for class-based components, by initializing the property. See: https://vuejs.org/v2/guide/reactivity.html#Declaring-Reactive-Properties. found in ---> <Pages/index.vue> at pages/index.vue <Nuxt> <Layouts/default.vue> at layouts/default.vue <Root> ERROR [Vue warn]: Property or method "description" is not defined on the instance but referenced during render. Make sure that this property is reactive, either in the data option, or for class-based components, by initializing the property. See: https://vuejs.org/v2/guide/reactivity.html#Declaring-Reactive-Properties. found in ---> <Pages/index.vue> at pages/index.vue <Nuxt> <Layouts/default.vue> at layouts/default.vue <Root>
然后可以訪問了
訪問如下網址,但我不知道為什么端口號是這個,之前變過好幾次。
http://localhost:60774/
圖一:
圖二:
第一次使用,貌似搭建成功了,之后再完善
安裝幻燈片插件
同樣遇見了問題,執行了兩邊下面代碼才成功
在執行命令前需要先停止項目
npm install vue-awesome-swiper
如圖:
終止批處理操作嗎(Y/N)? y PS D:\heima\guili_vue\vue-admin-front-nuxt> npm install vue-awesome-swiper npm WARN deprecated fsevents@1.2.13: fsevents 1 will break on node v14+ and could be using insecure binaries. Upgrade to fsevents 2. npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@^1.2.7 (node_modules\_chokidar@2.1.8@chokidar\node_modules\fsevents): npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.2.13: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"}) 。
。
。此處省略很多行
。
。 npm WARN @vue/babel-plugin-transform-vue-jsx@1.1.2 requires a peer of @babel/core@^7.0.0-0 but none is installed. You must install peer dependencies yourself. npm WARN @babel/plugin-syntax-jsx@7.10.4 requires a peer of @babel/core@^7.0.0-0 but none is installed. You must install peer dependencies yourself. npm WARN @vue/babel-plugin-transform-vue-jsx@1.1.2 requires a peer of @babel/core@^7.0.0-0 but none is installed. You must install peer dependencies yourself. npm WARN webpack-external-import@2.2.4 requires a peer of webpack@^4.40.2 but none is installed. You must install peer dependencies yourself. npm WARN vue-awesome-swiper@4.1.1 requires a peer of swiper@^5.2.0 but none is installed. You must install peer dependencies yourself. npm WARN vue-awesome-swiper@4.1.1 requires a peer of vue@2.x but none is installed. You must install peer dependencies yourself. npm ERR! code ENOENT npm ERR! syscall rename npm ERR! path D:\heima\guili_vue\vue-admin-front-nuxt\node_modules\_shebang-command@1.2.0@shebang-command\node_modules\shebang-regex npm ERR! dest D:\heima\guili_vue\vue-admin-front-nuxt\node_modules\_shebang-command@1.2.0@shebang-command\node_modules\shebang-regex npm ERR! errno -4058 npm ERR! enoent ENOENT: no such file or directory, rename 'D:\heima\guili_vue\vue-admin-front-nuxt\node_modules\_shebang-command@1.2.0@shebang-command\node_modules\shebang-regex' -> 'D:\heima\guili_vue\vue-admin-front-nuxt\node_modules\_shebang-command@1.2.0@shebang-command\node_modules\shebang-regex' npm ERR! enoent This is related to npm not being able to find a file. npm ERR! enoent npm ERR! A complete log of this run can be found in: npm ERR! C:\Users\oor\AppData\Roaming\npm-cache\_logs\2020-08-17T07_44_33_049Z-debug.log PS D:\heima\guili_vue\vue-admin-front-nuxt> npm install vue-awesome-swiper npm WARN registry Unexpected warning for https://registry.npmjs.org/: Miscellaneous Warning ETIMEDOUT: request to https://registry.npmjs.org/vue-awesome-swiper failed, reason: connect ETIMEDOUT 104.16.17.35:443 npm WARN registry Using stale data from https://registry.npmjs.org/ due to a request error during revalidation. npm notice created a lockfile as package-lock.json. You should commit this file. npm WARN vue-awesome-swiper@4.1.1 requires a peer of swiper@^5.2.0 but none is installed. You must install peer dependencies yourself. npm WARN vue-awesome-swiper@4.1.1 requires a peer of vue@2.x but none is installed. You must install peer dependencies yourself. + vue-awesome-swiper@4.1.1 added 1 package from 1 contributor and removed 1954 packages in 401.678s