npm install coderwhy自动生成页面对应路由文件

最新推荐文章于 2024-08-14 17:47:16 发布
最新推荐文章于 2024-08-14 17:47:16 发布
阅读量109 收藏 1
点赞数 2
分类专栏： 项目集 TypeScript vue3 文章标签： npm 前端 vue.js
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_52031408/article/details/130533028
版权
项目集 同时被 3 个专栏收录
7 篇文章 0 订阅
订阅专栏
TypeScript
7 篇文章 0 订阅
订阅专栏
vue3
3 篇文章 0 订阅
订阅专栏
该文章介绍了如何使用npm安装王红元老师的coderwhy-g工具，该工具能帮助开发者基于Vue3的setup函数自动生成页面。通过添加`add3page_setup`命令并可选地指定`-d`参数来设定生成页面的路径，执行后会在路由目录下创建对应的ts文件。
摘要由CSDN通过智能技术生成

 npm install coderwhy -g 全局安装王红元老师的自动生成工具

使用命令介绍：

        add3page_setup：使用vue3的setup函数生成页面

        -d：指定生成vue组件页面的路径

命令执行成功后，会对应帮我们在路由下生成对应的ts文件

 

 

 

 

 

 

江淮-Z
关注
  • 2
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
专栏目录
网络学习（第十一篇-数据链路层讲解和cisco交换机常用命令讲解）
qq_43068990的博客
12-09 651
分层 分层思想：将复杂的流程分解为几个功能相对单一的子通信需求->定义协议标准 完成每一件事情，协议很多怎么办？ 分层 OSI七层模型和TCP/IP五层协议栈哪个先有？ 理论上是一起有的，OSI是先写模型，后填协议。而TCP/IP是先填的协议后有的模型。 五层协议 应用层：进程间通信 数据 传输层：添加上层源，目的端口号。数据段 网络层：添加源，目的IP，用于点到点通信。数据包 数据链路层：添加源，目的MAC。帧。交换机是工作在数据链路层，只认识MAC地址。 物理层：比特 bit 应用层对应的协议：
coderwhy 前端系统课 react nodejs webpack 等
wchat_fee1024的博客
04-26 2203
1. 减少 HTTP 请求 一个完整的 HTTP 请求需要经历 DNS 查找，TCP 握手，浏览器发出 HTTP 请求，服务器接收请求，服务器处理请求并发回响应，浏览器接收响应等过程。接下来看一个具体的例子帮助理解 HTTP ： 这是一个 HTTP 请求，请求的文件大小为 28.4KB。 名词解释： Queueing: 在请求队列中的时间。 Stalled: 从TCP 连接建立完成，到真正可以传输数据之间的时间差，此时间包括代理协商时间。 Proxy negotiation: 与代理
npm命令自动生成页面
huibin
05-12 576
在vue项目中你还自己手动创建新文件么？来学一下使用npm命令创建文件吧，操作简单最重要的是逼格高 1.添加npm命令 首先在package.json文件scripts中添加 <!--可以创建两个 一个生成组件，另一个生成页面--> "scripts": { <!-- ./scripts/newComp 是对应生成模板文件的js文件路径，可以根据实际情况修改--> "new:comp": "node ./scripts/newComp", "new:pag.
后台管理-----动态路由1（首页页面与路由映射的创建）
weixin_51614564的博客
08-17 462
点击菜单的每一项都会有对应的一个组件，对应的组件都会在内容区进行展示通俗点：菜单---路由 之间的映射关系。我们就是根据服务器给我们返回的menus 给我们动态的返回了一个菜单。实现解决方案：1.拿到菜单，根据菜单动态的生成路由映射（让菜单和路由是动态生成的）2.后端返回的数据里有我们的url ，这个就是对应我们路由里面的path3.有了path 可以让其对应我们的component（...
跟着coderwhy学习的Vue.js笔记
CZYruobing的博客
09-09 1578
第一章：了解Vue.js 1.Vue.js是什么？ Vue 是一套用于构建用户界面的渐进式框架。与其它大型框架不同的是，Vue 被设计为可以自底向上逐层应用。Vue 的核心库只关注视图层，不仅易于上手，还便于与第三方库或既有项目整合。另一方面，当与现代化的工具链以及各种支持类库结合使用时，Vue 也完全能够为复杂的单页应用提供驱动。 2.Vue.js安装方法 方式一：直接CDN引入 <!-- 开发环境版本，包含了有帮助的命令行警告 --> <script src="https:
vue项目内自动生成页面，zash-cli
zwf193071的专栏
08-03 2561
zash-cli A simple CLI for generating pages into your projects Author：zwf193071 E-mail: 997131679@qq.com date: 2020/07/29 Preface 这些页面都是相似的，为何要反复的拷贝来拷贝去？好不容易拷贝完，还得为新增的页面添加路由、左侧菜单和面包屑导航的功能，555…不甘心将时间浪费在这些细枝末节上，于是擦干眼泪，撸起袖子做了一套自动化生成页面的工具，希望能给后面的读者一些启示。 F
VUE学习笔记 coderwhy老师（持更）
qq_43325226的博客
12-13 1267
一、邂逅Vue.js 1.1. 认识Vue.js •Vue的读音：(/vju:/，类似于view) • Vue的渐进式 ◦渐进式意味着你可能将Vue作为你应用的一部分嵌入其中，带来更丰富的交互体验 ◦或者如果你希望将更多的业务逻辑使用Vue实现，那么Vue的核心库以及其生态系统比如Core+Vue-router+Vuex，也可以满足你各种各样的需求 ◦简单说 • Vue的特点 ◦解耦视图和数据 ◦可复用的组件：一个组件可以在多个页面 里面用 ◦前端路由技术 ◦状态管理 ◦虚拟DOM 1.2. 安装Vue •
跟CoderWhy老师学习Vue的笔记
qq_26017543的博客
10-31 792
Vue git仓库地址：https://gitee.com/codekitty_lee/vue-study B站视频地址：https://www.bilibili.com/video/BV15741177Eh Vue的生命周期 生命周期：一个事物从诞生到消亡的整个过程 Vue的生命周期函数 beforeCreate 创建前 created 创建后 beforeMount 挂载前 mounted 挂载后 beforeUpdate 更新前 updated 更新后 beforeDestory 销毁前 de
vue笔记（coderwhy）
chongyang_的博客
10-05 2744
开始 跟着b站 coderwhy 老师所做的笔记，对比了几个感觉很适合Vue初学 链接：https://www.bilibili.com/video/BV15741177Eh?from=search&seid=5110308374587736588&spm_id_from=333.337.0.0 下载本地Markdown文件：https://gitee.com/xiao-li-tongxue/img/tree/master/ 00、ES6的补充(后面用到) a、let/var ES5中的
使用 webpack 插件自动生成 vue 路由文件的方法
12-10
`vue-route-webpack-plugin` 是一个基于 Webpack 的插件，它的主要功能是在项目运行时自动扫描指定目录下的Vue 组件文件，从中提取路由信息并生成对应的路由配置文件。这大大减轻了手动维护路由配置的负担，尤其在...
优先级纱线：如果项目具有yarn.lock，请将npm install更改为yarn
02-03
如果项目具有yarn.lock，请将npm install更改为yarn。 命令行界面 $ npm install --global prioritize-yarn $ alias npm='prioritize-yarn' // Using yarn, when there is a `yarn.lock`. $ npm install yarn ...
通过npm或yarn自动生成vue组件的方法示例
01-19
然后写template、script、style这些东西，如果是公共组件，是不是还要新建一个index.js用来导出vue组件、虽然有vscode有代码片段能实现自动补全，但还是很麻烦，今天灵活运用scripts工作流，自动生成vue文件和目录。...
submodules-install:NPM子模块安装程序
05-14
该模块提供了一个用于在位置列表中调用npm i的系统，最终提供了自动子模块的安装。 在提供的子模块glob中，它将仅匹配包含“ package.json”的目录。 用法 通过npm安装： npm i submodules-install --save 使用...
npm install 报错踩坑路,npm报错以及卸载node,npm和node版本不符合
01-08
npm install 报错踩坑路 先出现的是超过最大调用栈问题： npm ERR! Maximum call stack size exceeded 百度之后说给npm降级或者升级 降级 ： npm install -g npm@5.4.0 升级 ： npm install -g npm 升级到最新版 ...
精通NPM版本管理：实现版本范围锁定行为的策略
2401_85439108的博客
08-13 1061
通过本文的介绍，我们学习了如何使用NPM设置包的版本范围锁定行为，这是一种在开发环境中控制依赖包更新，同时在生产环境中保持稳定的高级策略。合理地使用版本控制策略，可以大大提高项目的可维护性和可靠性。希望本文能够帮助读者更好地理解和应用NPM的版本控制功能，解决实际项目中的依赖管理问题。
npm install pnpm -g 报错的解决方法
最新发布
骨子里的偏爱
08-14 229
npm install pnpm -g 报错的解决方法
深度解析：NPM、PNPM、Yarn 包管理工具的介绍与对比
Caleb的博客
08-14 884
NPM 是 Node.js 的默认包管理工具，也是最早出现的 JavaScript 包管理工具。随着 Node.js 的流行，NPM 也成为了前端开发中最广泛使用的包管理工具之一。Yarn 是由 Facebook 在 2016 年推出的包管理工具，旨在解决 NPM 的一些性能和安全问题。Yarn 在保证兼容 NPM 的基础上，引入了一些新特性，提升了包管理的效率和可靠性。PNPM 是一种更现代的包管理工具，采用了独特的“硬链接”技术，极大地节省了磁盘空间，并提升了安装速度。
NPM版本控制策略：实现版本候选行为的指南
2402_85761468的博客
08-13 679
通过本文的介绍，我们学习了如何使用NPM设置包的版本候选行为，这是一种在开发环境中使用最新候选版本，同时在生产环境中保持稳定的高级策略。合理地使用版本控制策略，可以大大提高项目的可维护性和可靠性。希望本文能够帮助读者更好地理解和应用NPM的版本控制功能，解决实际项目中的依赖管理问题。
npm install 除了下载文件 还会生成配置文件吗
06-13
在使用 `npm install` 命令时，如果存在 `package.json` 文件，它会根据 `package.json` 文件中的依赖列表来下载依赖，并且会在下载完毕后自动生成 `package-lock.json` 文件。 `package-lock.json` 文件是 `npm` 使用的一种锁定文件，用于确保在不同的机器上安装相同的依赖包时，可以保证版本一致性。该文件会记录依赖包的版本号和具体安装路径，以便在后续安装依赖时可以精确地安装相应的版本。 另外，如果在使用 `npm install` 命令时添加了 `--save` 或 `--save-dev` 参数，则会在 `package.json` 文件中自动添加相应的依赖项信息，用于记录该依赖包是开发依赖还是生产依赖。例如，使用以下命令安装 `lodash` 并将其添加为生产依赖： ```bash npm install lodash --save ``` 会自动在 `package.json` 文件中添加以下内容： ```json { "dependencies": { "lodash": "^4.17.21" } } ``` 上面的内容表示 `lodash` 是生产依赖，并且需要安装 `4.17.21` 版本或更高版本。 因此，`npm install` 命令除了下载依赖之外，还会生成 `package-lock.json` 文件和更新 `package.json` 文件中的依赖项信息。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

江淮-Z

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值