1-电商后台管理系统实战(环境部署)软技收集2024年12月17日 20:19:30更新关注私信 共计9735字,阅读大约需要32分27秒 022911 加入QQ群 QQ联系我 微信公众号 微信联系我 在线联系站长 所有用到的资料在文章末尾获取!!! 一、VSCode的安装 VSCode安装配置使用教程-软技收集(这个是VSCode安装教程) ①安装中文插件 ②重启VSCode ③切换成功 二、Node.js的安装 建议安装node.js20版本 ①下载node.js安装包 ②安装node.js 1.双击 node-v20.18.1-x64.msi 安装包,点击Next 2.勾选同意xxxxx,点击Next 3.选择安装路径,点击Next 4.这里我选择C盘 5.继续点击下一步Next 6.继续点击下一步Next 7.点击安装 8.点击完成 9.使用cmd查看是否安装成功 三、全局安装vue-Cli脚手架 Vue CLI 的包名称由 vue-cli 改成了 @vue/cli。如果你已经全局安装了旧版本的 vue-cli (1.x 或 2.x),你需要先通过 npm uninstall vue-cli -g 或 yarn global remove vue-cli 卸载它。 1.可以使用下列任一命令安装这个新的包: npm install -g @vue/cli yarn global add @vue/cli 2.执行之前记得更换npm源,不然下载不了 推荐使用标红的!!!!更换后如果报错就多试几次或者使用下面方法 npm切换成淘宝源或者其他私有源,或者官方源,也是常有的操作,有时需要永久切换,有时需要临时切换,下面我们来操作一波基本语法: 查看当前npm仓库的源 npm config get registry 永久切换 npm config set registry https://xxxxxxxx 临时切换 npm –registry https://xxxxxxx install express 使用 cnpm npm install -g cnpm –registry=https://registry.npm.taobao.org 首先查看当前npm仓库的源 npm config get registry永久切换官方的源 npm config set registry https://registry.npmjs.org/永久切换成淘宝源 npm config set registry https://registry.npm.taobao.org 永久切换成阿里源 npm config set registry https://registry.npmmirror.com临时切换官方的源 npm –registry https://registry.npmjs.org/ install express临时切换成淘宝源 npm –registry https://registry.npm.taobao.org install express 更换npm源教程 [超详细]npm更换下载源一. 临时换源有时只需要临时换源进行插件的下载,可以采用如下方式 npm –registry https://registry.npmmirror.com install [依赖的名称]二.持久换源1.下载cnpm方式cnpm是由淘宝团队开发的,作为一个完整的npmjs.org镜像,用户可以用它来替代官方的npm(Node Package Manager),且它是只读的。 使用阿里定制的 cnpm 命令行工具代替默认的 npm npm install -g cnpm –registry=https://registry.npm.taobao.org检测cnpm版本,如果安装成功会显示cnpm的基本信息 cnpm -v安装完成后,以后安装插件使用 cnpm install 即可 2.使用set registry命令方式查看当前源 npm config get registry更换npm源为国内淘宝镜像 npm config set registry https://registry.npmmirror.com/如果要还原成官方默认源 npm config set registry https://registry.npmjs.org/3.使用nrm管理npm源nrm 是一个 npm 源管理器,允许你快速地在不同的 npm 源间切换 安装nrm源管理工具 npm install -g nrm查看nrm配置 nrm里默认有一些镜像源的配置 带 * 即为当前使用的源地址 nrm ls 切换不同镜像(例如切换淘宝镜像) nrm use taobao测试镜像速度 nrm test taobao使用nrm添加镜像地址 nrm add [name] [url] [name]替换成镜像名称 [url]替换成镜像地址删除nrm镜像 nrm del [name] [name]替换成镜像名称 3.可以用这个命令来检查其版本是否正确: vue –version ( vue –v )或者vue -V 也可以,注意:-V 是大写 输入检测vue版本号命令后出现版本号即安装成功! 如需升级全局的 Vue CLI 包,请运行: npm update -g @vue/cli 或者 yarn global upgrade –latest @vue/cli安装vue脚手架后,可用命令 vue create 项目名 创建vue项目 创建完成后就可以开始编写vue项目了! 4.安装成功的例示 安装成功的例示 PS C:\Users\Administrator\Desktop\shop-admin> npm install -g @vue/clinpm warn deprecated source-map-url@0.4.1: See https://github.com/lydell/source-map-url#deprecatednpm warn deprecated urix@0.1.0: Please see https://github.com/lydell/urix#deprecatednpm warn deprecated resolve-url@0.2.1: https://github.com/lydell/resolve-url#deprecatednpm warn deprecated source-map-resolve@0.5.3: See https://github.com/lydell/source-map-resolve#deprecatednpm warn deprecated rimraf@2.6.3: Rimraf versions prior to v4 are no longer supportednpm warn deprecated @babel/plugin-proposal-nullish-coalescing-operator@7.18.6: This proposal has been merged to the ECMAScript standard and thus this plugin is no longer maintained. Please use @babel/plugin-transform-nullish-coalescing-operator instead.npm warn deprecated @babel/plugin-proposal-class-properties@7.18.6: This proposal has been merged to the ECMAScript standard and thus this plugin is no longer maintained. Please use @babel/plugin-transform-class-properties instead.npm warn deprecated @babel/plugin-proposal-optional-chaining@7.21.0: This proposal has been merged to the ECMAScript standard and thus this plugin is no longer maintained. Please use @babel/plugin-transform-optional-chaining instead.npm warn deprecated inflight@1.0.6: This module is not supported, and leaks memory. Do not use it. Check out lru-cache if you want a good and tested way to coalesce async requests by a key value, which is much more comprehensive and powerful.npm warn deprecated glob@7.2.3: Glob versions prior to v9 are no longer supportednpm warn deprecated rimraf@3.0.2: Rimraf versions prior to v4 are no longer supportednpm warn deprecated apollo-datasource@3.3.2: The apollo-datasource package is part of Apollo Server v2 and v3,which are now end-of-life (as of October 22nd 2023 and October 22nd 2024, respectively). See https://www.apollographql.com/docs/apollo-server/previous-versions/ for more details.npm warn deprecated apollo-server-errors@3.3.1: The apollo-server-errors package is part of Apollo Server v2 and v3, which are now end-of-life (as of October 22nd 2023 and October 22nd 2024, respectively). This package’s functionality is now found in the @apollo/server package. See https://www.apollographql.com/docs/apollo-server/previous-versions/ for more details.npm warn deprecated apollo-server-plugin-base@3.7.2: The apollo-server-plugin-base package is part of Apollo Server v2 and v3, which are now end-of-life (as of October 22nd 2023 and October 22nd 2024, respectively). This package’s functionality is now found in the @apollo/server package. See https://www.apollographql.com/docs/apollo-server/previous-versions/ for more details.npm warn deprecated apollo-server-types@3.8.0: The apollo-server-types package is part of Apollo Server v2 andv3, which are now deprecated (end-of-life October 22nd 2023 and October 22nd 2024, respectively). This package’sfunctionality is now found in the @apollo/server package. See https://www.apollographql.com/docs/apollo-server/previous-versions/ for more details.npm warn deprecated apollo-server-express@3.13.0: The apollo-server-express package is part of Apollo Server v2 and v3, which are now end-of-life (as of October 22nd 2023 and October 22nd 2024, respectively). This package’sfunctionality is now found in the @apollo/server package. See https://www.apollographql.com/docs/apollo-server/previous-versions/ for more details.npm warn deprecated shortid@2.2.16: Package no longer supported. Contact Support at https://www.npmjs.com/support for more info.npm warn deprecated apollo-reporting-protobuf@3.4.0: The apollo-reporting-protobuf package is part of Apollo Server v2 and v3, which are now deprecated (end-of-life October 22nd 2023 and October 22nd 2024, respectively). This package’s functionality is now found in the @apollo/usage-reporting-protobuf package. See https://www.apollographql.com/docs/apollo-server/previous-versions/ for more details.npm warn deprecated apollo-server-env@4.2.1: The apollo-server-env package is part of Apollo Server v2 and v3,which are now deprecated (end-of-life October 22nd 2023 and October 22nd 2024, respectively). This package’s functionality is now found in the @apollo/utils.fetcher package. See https://www.apollographql.com/docs/apollo-server/previous-versions/ for more details.npm warn deprecated subscriptions-transport-ws@0.11.0: The subscriptions-transport-ws package is no longer maintained. We recommend you use graphql-ws instead. For help migrating Apollo software to graphql-ws, see https://www.apollographql.com/docs/apollo-server/data/subscriptions/#switching-from-subscriptions-transport-ws For general help using graphql-ws, see https://github.com/enisdenjo/graphql-ws/blob/master/README.mdnpm warn deprecated apollo-server-core@3.13.0: The apollo-server-core package is part of Apollo Server v2 and v3, which are now end-of-life (as of October 22nd 2023 and October 22nd 2024, respectively).This package’s functionality is now found in the @apollo/server package. See https://www.apollographql.com/docs/apollo-server/previous-versions/ for more details.npm warn deprecated vue@2.7.16: Vue 2 has reached EOL and is no longer actively maintained. See https://v2.vuejs.org/eol/ for more details. added 829 packages in 1m 75 packages are looking for fundingrun npm fund for detailsPS C:\Users\Administrator\Desktop\shop-admin> 四、项目依赖安装 1.本地依赖安装 确认在你的项目目录中是否有 node_modules 文件夹,并且里面是否包含 @vue/cli-service。你可以通过以下命令来强制重新安装所有的依赖项,这可能会修复任何可能存在的安装问题: npm install 2.安装成功的例示 安装成功的例示 PS C:\Users\Administrator\Desktop\shop-admin> npm installnpm warn deprecated inflight@1.0.6: This module is not supported, and leaks memory. Do not use it. Check out lru-cache if you want a good and tested way to coalesce async requests by a key value, which ismuch more comprehensive and powerful.npm warn deprecated @babel/plugin-proposal-class-properties@7.18.6: This proposal has been merged to the ECMAScript standard and thus this plugin is no longer maintained. Please use @babel/plugin-transform-class-properties instead.npm warn deprecated @humanwhocodes/config-array@0.5.0: Use @eslint/config-array insteadnpm warn deprecated stable@0.1.8: Modern JS already guarantees Array#sort() is a stable sort, so this library is deprecated. See the compatibility table on MDN: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/sort#browser_compatibilitynpm warn deprecated consolidate@0.15.1: Please upgrade to consolidate v1.0.0+ as it has been modernized with several long-awaited fixes implemented. Maintenance is supported by Forward Email at https://forwardemail.net ; follow/watch https://github.com/ladjs/consolidate for updates and release changelognpm warn deprecated rimraf@3.0.2: Rimraf versions prior to v4 are no longer supportednpm warn deprecated glob@7.2.3: Glob versions prior to v9 are no longer supportednpm warn deprecated @humanwhocodes/object-schema@1.2.1: Use @eslint/object-schema insteadnpm warn deprecated babel-eslint@10.1.0: babel-eslint is now @babel/eslint-parser. This package will no longer receive updates.npm warn deprecated webpack-chain@6.5.1: Package no longer supported. Contact Support at https://www.npmjs.com/support for more info.npm warn deprecated eslint@7.32.0: This version is no longer supported. Please see https://eslint.org/version-support for other options. added 938 packages in 2m 119 packages are looking for fundingrun npm fund for detailsPS C:\Users\Administrator\Desktop\shop-admin> 五、代码内部的部署 1.下载 shop-admin 项目 2.将文件夹解压后拖到VSCode打开 3.打开VSCode终端 这里输入启动项目命令‘vue-cli-service’ 不是内部或外部命令,也不是可运行的程序,原因是我们的项目所需要的 Vue CLI 或者 Vue CLI 服务没有下载安装 4.下载安装 Vue CLI 或者 Vue CLI 服务 遇到 'vue-cli-service' 不是内部或外部命令,也不是可运行的程序或批处理文件 的错误信息通常意味着你的环境中缺少 Vue CLI 或者 Vue CLI 服务未正确安装。 要解决这个问题,你可以按照以下步骤操作: 安装 Vue CLI 确保你已经全局安装了 Vue CLI。可以通过下面的命令来安装它: npm install -g @vue/cli 六、启动项目 1.输入启动命令 在Vue项目中,常见的启动命令有: npm run dev npm run dev 这个命令通常用于启动开发服务器,实现代码的热重载。(建议使用) npm run serve npm run serve 与npm run dev类似,也是用于启动开发服务器。 npm start npm start 在一些项目中,start脚本也被用来启动开发服务器。 2.打开浏览器查看 1.输入启动命令后会显示 PS C:\Users\Administrator\Desktop\shop-admin> npm run serve shop-admin@0.1.0 servevue-cli-service serve INFO Starting development server… DONE Compiled successfully in 23012ms 21:28:49 App running at: Local: http://localhost:8080/ Network: http://10.0.4.2:8080/ Note that the development build is not optimized.To create a production build, run npm run build. 2.在浏览器打开网址 App running at: Local: http://localhost:8080/ Network: http://10.0.4.2:8080/ 例如这个一般是是: http://localhost:8080/ 启动成功!!!! 3.管理密码 用户名: admin 密码: 123456 温馨提示:本文最后更新于2024年12月17日 20:19:30,某些文章具有时效性,若有错误或已失效,请在下方留言或联系站长。 本文资源整理自网络,仅供学习和研究使用,请在下载后24小时内删除,谢谢合作! 如果觉得本文有用就按Ctrl+D收藏,方便以后随时翻看,免得想看时又找不着 或 发现更多 免费资源1-电商后台管理系统实战(环境部署)资源下载 十二 5 本站历史上的今天 "吼吼~~~,往年的今天站长不知道跑哪里偷懒去了~~~" © 版权声明 软技收集版权声明 ① 本网站名称:❤软技收集❤ 本站永久网址:▶https://rjasj.com◀ ② 如果您喜欢本站, 点击这儿 开通VIP,同时按Ctrl+D保存网页。 ③ 在浏览网站中可能会帮助到您: 使用帮助 | 报毒说明 | 侵权删除 | | ④ 本站接受投稿,同时也开启了创作分成,投稿用户只需自行设置收费即可!点击查看 如果需要投稿,请点击投稿 发布文章! ⑤ 本站一律禁止以任何方式发布或转载任何违法的相关信息,访客发现请向站长举报。 ⑥ 本站资源大多存储在云盘,如发现链接失效,请联系我们我们会第一时间更新。 ⑦ 修改版本安卓及电脑软件,加群提示为修改者自留,非本站信息,注意鉴别。 ⑧ 本网站部分资源来源于网络,仅供大家学习与参考,请于下载后24小时内删除。 ⑨ 若作商业用途,请联系原作者授权,若本站侵犯了您的权益请联系站长进行删除处理。 THE ENDVSCode安装使用教程技术分享# 环境部署# 电商后台管理系统 喜欢就支持一下软技收集吧点赞11赞赏 分享QQ空间微博QQ好友海报分享复制链接收藏