第一次使用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:heimaguili_vuevue-admin-front-nuxt> npm cache clean --force npm WARN using --force I sure hope you know what you are doing. PS D:heimaguili_vuevue-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:heimaguili_vuevue-admin-front-nuxt ode_modules\_ajv-keywords@2.1.1@ajv-keywords unmet with D:heimaguili_vuevue-admin-front-nuxt ode_modulesajv(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:heimaguili_vuevue-admin-front-nuxt ode_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:heimaguili_vuevue-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:heimaguili_vuevue-admin-front-nuxt>
紧接着我又执行了启动命令
如下图所示(红色为执行过的命令,品红色成功提示):
PS D:heimaguili_vuevue-admin-front-nuxt> npm run dev > guli@1.0.0 dev D:heimaguili_vuevue-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:heimaguili_vuevue-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 ode_modulesfsevents): 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:heimaguili_vuevue-admin-front-nuxt ode_modules\_shebang-command@1.2.0@shebang-command ode_modulesshebang-regex npm ERR! dest D:heimaguili_vuevue-admin-front-nuxt ode_modules\_shebang-command@1.2.0@shebang-command ode_modulesshebang-regex npm ERR! errno -4058 npm ERR! enoent ENOENT: no such file or directory, rename 'D:heimaguili_vuevue-admin-front-nuxt ode_modules\_shebang-command@1.2.0@shebang-command ode_modulesshebang-regex' -> 'D:heimaguili_vuevue-admin-front-nuxt ode_modules\_shebang-command@1.2.0@shebang-command ode_modulesshebang-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:UsersoorAppDataRoaming pm-cache\_logs2020-08-17T07_44_33_049Z-debug.log PS D:heimaguili_vuevue-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