简介

本文介绍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)。

用法

用法：

vue-cli-service serve [options] [entry]

选项：

--open
在服务器启动时打开浏览器
--copy
在服务器启动时将 URL 复制到剪切版
--mode
指定环境模式 (默认值：development)
--host
指定 host (默认值：0.0.0.0)
--port
指定 port (默认值：8080)
--https
使用 https (默认值：false)

vue-cli-service build

说明

作用简述：打包。

vue-cli-service build

会在 dist/ 目录生成一个可用于生产环境的包。

打包的特点

压缩JS/CSS/HTML
自动的 vendor chunk splitting
这样可以更好地缓存。

chunk manifest 会内联在 HTML 里。

用法

用法：

vue-cli-service build [options] [entry|pattern]

选项：

--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不是内部或外部命令,也不是可运行的程序

npm install vue-cli-service -S