安装
Vite是一个web开发构建工具,由于其原生 ES 模块导入方式,可以实现闪电般的冷服务器启动。
通过在终端中运行以下命令,可以使用 Vite 快速构建 Vue 项目。
//npm 6.x
npm init vite@latest 项目名字 --template vue
//npm 7+,需要额外的双短线
npm init vite@latest project-name -- --template vue
cd 项目名字 //进入项目
npm install //初始化配置项目
npm run dev //运行项目
将Vue.js添加到项目中主要有四种方式:
- 在页面上以CDN包的形式导入
<script src="https://unpkg.com/vue@next"></script>
-
下载JavaScript文件并自行托管
下载相关.js文件并自行托管在你的服务器上,然后你可以通过<script src='./js/vue.js'>标签引入,与使用CDN的方法类似。 -
使用npm安装
在用Vue构建大型应用时推荐使用npm安装,npm能很好地诸如webpack或Rollup模块打包器配合使用。
//最新稳定版
npm install vue@next
Vue还提供了编写单文件组件的配套工具,如果你想使用单文件组件,那么你还需要安装@vue/compiler-sfc
npm install -D @vur/compiler-sfc
- 使用官方的CLI来构建一个项目,它为现代前端工作流程提供了功能齐备的构建设置。
Vue提供了一个官方的CLI,为单页面应用(SPA)快速搭建复杂的脚手架。
//安装最新版本的@vue/cli:
npm install -g @vue/cli
然后在Vue项目中运行:
vue upgrade --next