2022-09-05 17:36:45 +08:00
|
|
|
## vue-live
|
|
|
|
> vue的live开发环境, 指在提供一个不需要编译打包的开发环境和生产环境。
|
|
|
|
|
2022-10-10 19:39:52 +08:00
|
|
|
|
|
|
|
**注**
|
|
|
|
`本框架和用法 都是在 Linux 或者 Mac 下面测试通过。至于使用 Windows 并坚持玩新技术的同学,我坚信他们一定有着过人的、`
|
|
|
|
`甚至是不可告人的兼容性 bug 处理能力,所以这部分同学麻烦在安装过程无法继续时,自行兼容一下`
|
|
|
|
|
|
|
|
|
2022-09-05 17:36:45 +08:00
|
|
|
### 特点
|
|
|
|
|
2023-02-25 22:07:53 +08:00
|
|
|
- 一切皆CDN, 即除了自己的业务代码, 其他的依赖皆直接引用CDN地址, 所以, 无论是开发速度还是编译速度, 都是毫秒级完成。
|
2023-02-01 11:00:42 +08:00
|
|
|
- 无需`vite、webpack、rollup`等任何打包工具, 一切都像传统jq开发一样, 但是却拥有着类似vite的开发体验。
|
2022-09-05 17:36:45 +08:00
|
|
|
- `All in ESM`, 所以浏览器需要比较新, 理论上最低 chrome v63, 建议 v95+。
|
2023-02-01 11:00:42 +08:00
|
|
|
- 可轻松支持`多页面应用`(万级数量无压力)。
|
2022-09-05 17:36:45 +08:00
|
|
|
- 支持直接用 `.vue 单文件组件`。
|
|
|
|
|
|
|
|
|
|
|
|
### 你需要知道的几个事情
|
|
|
|
|
|
|
|
- 因为没有打包, 所以所有的文件引用都是按源代码的结构, 对于源码的保护比较弱(虽然打包也没约等于没保护, 因为前端没秘密)。
|
|
|
|
- 因为是用的是原生的`ESM`,所以引用的**依赖/文件**, 需要完整的路径, 不得省略后缀名, 更不能省略`index.js/index.vue`。
|
2022-10-18 16:02:29 +08:00
|
|
|
- 因为没有内置完整的样式处理, 所以`scoped特性`虽然支持, 但vue中的 `>>>、:deep、v-deep`等功能不可用。
|
2022-09-05 17:36:45 +08:00
|
|
|
- `单文件组件`中的样式, 如果是用scss, 不支持引用其他文件, 也不支持设置共用定义文件。
|
|
|
|
- 样式预处理器, 只支持scss, 不支持less。
|
|
|
|
|
|
|
|
|
|
|
|
### 适用场景
|
|
|
|
|
2023-02-25 22:07:53 +08:00
|
|
|
- 开源小项目, 如 一些在线演示的小项目, 需要快速开发, 快速发布的。
|
|
|
|
- 多页应用, 数量庞大的, 可以做到秒编译打包。
|
2023-02-01 11:00:42 +08:00
|
|
|
- 不需要兼容老旧浏览器的项目, 毕竟需要完整支持`ESM`
|
2022-09-05 17:36:45 +08:00
|
|
|
- `electron`应用, 能很好控制浏览器内核版, 并且electron的打包, 可以把代码打成asar, 对源码有一定的保护作用
|
2023-02-01 11:00:42 +08:00
|
|
|
- 多页应用(MPA), 页面较多(好几百个, 甚至更多)。
|
2022-10-10 19:37:41 +08:00
|
|
|
|
|
|
|
|
|
|
|
### 使用
|
|
|
|
|
|
|
|
```bash
|
2023-02-01 11:00:42 +08:00
|
|
|
# 实例化新项目
|
2022-10-21 12:02:38 +08:00
|
|
|
npm create vue-live@latest
|
2022-10-10 19:37:41 +08:00
|
|
|
```
|