vue-cli 的快速原型开发是如何做到的?

vue-cli3 有一个serve命令,只需要执行以下命令就能够对一个.vue文件进行快速开发,而不必创建一个完整的项目,非常方便:

$ vue serve demo.vue

请问大家这是如何做到的呢?


各位,经过我一下午孜孜不倦地努力,开发了一个命令行工具,实现了跟
vue serve demo.vue 一样的功能。

至于为什么要开发这个呢,是因为我想在进行快速原型开发的时候,需要在全局附加上我需要的一些组件、样式等等。比如说在全局附加上element-ui的组件和样式,这是vue serve做不到的。

等工具的功能完善后,我会把工具仓库链接贴上来。

阅读 5.2k
2 个回答

刚稍微翻了下源码,vue serve 其实执行的还是正常的服务启动,因为使用vue serve前提是你安装了全局的npm install -g @vue/cli-service-global 他讲操作和文件部署这个全局模块中了,这样会有个问题,不同环境会存在差异

官网文档介绍如下

vue serve 使用了和 vue create 创建的项目相同的默认设置 (webpack、Babel、PostCSS 和 ESLint)。它会在当前目录自动推导入口文件——入口可以是 main.js、index.js、App.vue 或 app.vue 中的一个。你也可以显式地指定入口文件:

其实是这个 模块起的作用

@vue/cli-service-global

就相当于他帮你做了一个 简单的 项目,只是 当你执行 vue serve demo.vue 的时候 把 demo.vue 作为你 入口文件进行了加载

具体的实现,你可以看下 @vue/cli-service-global 的源码

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题