运行单个Vue文件;不创建脚手架项目运行.vue文件;写单个组件查看效果;Vue快速原型开发

你是否遇到不想创建脚手架项目,只想运行单个Vue文件的时候;

是否在写单个组件时想之间查看这个单Vue文件的效果;

或者仅仅想写个*.vue文件用于做测试

 

办法如下:

1、首先进入终端,全局安装vue/cli-service-global

npm install -g @vue/cli-service-global

 

2、在编辑器的Vue文件所在的文件夹目录下进入终端,启动文件

vue serve

 

3、或是直接在终端中 cd 进入Vue文件夹目录下,启动文件

某盘:\Vue文件所在的文件夹> vue serve Vue文件名.vue 或 vue serve

 

需要注意的是:

1、使用( vue serve ) 命令的话,会在当前目录自动推导入口文件——入口可以是 main.jsindex.jsApp.vue 或 app.vue 中的一个,若不是则报错。

运行单个Vue文件;不创建脚手架项目运行.vue文件;写单个组件查看效果;Vue快速原型开发

 

 

 可将文件名改为VueCLI的默认入口文件名( App.vue 或 app.vue ),也可以如下解决

 

2、使用( vue serve Vue文件名.vue ) 命令的话,就无需必定是上面的入口文件了,就可以自己显式地指定入口文件名了

推荐使用,写单个组件查看效果时极为方便!

运行单个Vue文件;不创建脚手架项目运行.vue文件;写单个组件查看效果;Vue快速原型开发

 

 也可移步去VueCLI快速原型开发地址了解更多内容:https://cli.vuejs.org/zh/guide/prototyping.html#vue-serve

 

 

上一篇:esbuild 学习(1)


下一篇:vue项目启动时,npm run serve 和 npm run dev 的区别