您的位置:首页 > Web前端 > Vue.js

vue3.x 快速原型开发

2018-10-30 11:20 344 查看

快速原型开发

你可以使用 

vue serve
 和 
vue build
 命令对单个 
*.vue
 文件进行快速原型开发,不过这需要先额外安装一个全局的扩展:

[code]npm install -g @vue/cli-service-global

vue serve
 的缺点就是它需要安装全局依赖,这使得它在不同机器上的一致性不能得到保证。因此这只适用于快速原型开发。

#vue serve

[code]Usage: serve [options] [entry]

在开发环境模式下零配置为 .js 或 .vue 文件启动一个服务器

Options:

-o, --open  打开浏览器
-c, --copy  将本地 URL 复制到剪切板
-h, --help  输出用法信息

你所需要的仅仅是一个 

App.vue
 文件:

[code]<template>
<h1>Hello!</h1>
</template>

然后在这个 

App.vue
 文件所在的目录下运行:

[code]vue serve

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

[code]vue serve MyComponent.vue

如果需要,你还可以提供一个 

index.html
package.json
、安装并使用本地依赖、甚至通过相应的配置文件配置 Babel、PostCSS 和 ESLint。

#vue build

[code]Usage: build [options] [entry]

在生产环境模式下零配置构建一个 .js 或 .vue 文件

Options:

-t, --target <target>  构建目标 (app | lib | wc | wc-async, 默认值:app)
-n, --name <name>      库的名字或 Web Components 组件的名字 (默认值:入口文件名)
-d, --dest <dir>       输出目录 (默认值:dist)
-h, --help             输出用法信息

你也可以使用 

vue build
 将目标文件构建成一个生产环境的包并用来部署:

[code]vue build MyComponent.vue

vue build
 也提供了将组件构建成为一个库或一个 Web Components 组件的能力。查阅构建目标了解更多。

阅读更多
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: