Vue Cli Service使用教程
内容目录
简介
本文介绍Vue的vue-cli-service的用法。
官网
https://cli.vuejs.org/zh/guide/cli-service.html
https://cli.vuejs.org/zh/config/#vue-config-js
概述
vue-cli-service是把webpack-dev-server包装了一层,所以,webpack-dev-server的配置方法都可以拿过来用。
命令
vue-cli-service serve
说明
作用简述:运行服务。
vue-cli-service serve 命令会启动一个开发服务器 (基于 webpack-dev-server) 并附带模块热重载 (Hot-Module-Replacement)。
用法
用法:
|
|
选项:
–open
在服务器启动时打开浏览器
–copy
在服务器启动时将 URL 复制到剪切版
–mode
指定环境模式 (默认值:development)
–host
指定 host (默认值:0.0.0.0)
–port
指定 port (默认值:8080)
–https
使用 https (默认值:false)
vue-cli-service build
说明
作用简述:打包。
|
|
会在 dist/ 目录生成一个可用于生产环境的包。
打包的特点
压缩JS/CSS/HTML
自动的 vendor chunk splitting
这样可以更好地缓存。
chunk manifest 会内联在 HTML 里。
用法
用法:
|
|
选项:
–mode
指定环境模式 (默认值:production)
–dest
指定输出目录 (默认值:dist)
–modern
使用现代模式构建应用,为现代浏览器交付原生支持的 ES2015 代码,并生成一个兼容老浏览器的包用来自动回退。
–target
app | lib | wc | wc-async (默认值:app)
允许你将项目中的任何组件以一个库或 Web Components 组件的方式进行构建。详见:构建目标。
–name
库或 Web Components 模式下的名字 (默认值:package.json 中的 “name” 字段或入口文件名)
–no-clean
在构建项目之前不清除目标目录的内容
–report
生成 report.html 以帮助分析包内容
–report-json
生成 report.json 以帮助分析包内容。
例如:包中包含的模块们的大小。
–watch
监听文件变化
跨域
其他网址
问题
vue-cli-service不是内部或外部命令,也不是可运行的程序
|
|
Author grabbyte
LastMod 2022-10-15