1、全局安装vite：npm install create-vite-app -g

2、创建项目：npx create-vite-app project-name

3、cd project-name -> npm install -> npm run dev

4、至此项目搭建完毕， 浏览器访问：http://localhost:3000/

6、npm install vue-router@next  -S 安装路由，并且配置路由文件  history: createWebHashHistory() hash 模式  history:createWebHistory() 正常模式

7、npm install vuex@next -S 安装store,并配置文件

8、npm install sass -D 安装sass

9、main.js

github例子：https://github.com/ytg123/Vue3.0--Element

欢迎大家一起学习！

vite 搭建Vue3.0项目的更多相关文章

  1. 从零搭建vue3.0项目架构（附带代码、步骤详解）

    前言: GitHub上我开源了vue-cli.vue-cli3两个库,文章末尾会附上GitHub仓库地址.这次把2.0的重新写了一遍,优化了一下.然后按照2.0的功能和代码,按照vue3.0的语法,完 ...

  2. vite创建vue3+ts项目流程

    vite+vue3+typescript搭建项目过程   vite和vue3.0都出来一段时间了,尝试一下搭vite+vue3+ts的项目 相关资料网址 vue3.0官网:https://v3.vue ...

  3. vue2.0与vue3.0项目创建

    脚手架安装与卸载 安装 npm install -g vue-cli //or npm install -g @vue/cli 卸载 npm uninstall -g vue-cli //or npm ...

  4. 从零开始搭建Vue2.0项目(一)之快速开始

    从零开始搭建Vue2.0项目(一)之项目快速开始 前言 该样板适用于大型,严肃的项目,并假定您对Webpack和有所了解vue-loader.确保还阅读vue-loader的文档,了解常见的工作流程配 ...

  5. Vue CLI 5 和 vite 创建 vue3.x 项目以及 Vue CLI 和 vite 的区别

    这几天进入 Vue CLI 官网,发现不能选择 Vue CLI 的版本,也就是说查不到 vue-cli 4 以下版本的文档. 如果此时电脑上安装了 Vue CLI,那么旧版安装的 vue 项目很可能会 ...

  6. vue-cli脚手架搭建vue3.0+typescripe项目

    新开个项目,小项目,小.顺手就用vue吧,vue3出来也几个月了,直接上了吧.一年多没用vue了,用的时候也得再熟悉,不如直接干3了! vue官方推荐使用的脚手架是 Vite 和 vue-cli ,延 ...

  7. Vue3.0项目快速搭建

    安装安装vue-cli npm install -g @vue/cli # 或者 yarn global add @vue/cli 创建项目 vue create hello-world 至此项目搭建 ...

  8. 新建vue3.0 项目—步骤详细介绍

    一.环境搭建 1.安装node环境(版本≥ 8.9) 2.安装vue-cli3.0 npm install @vue/cli -g 此处省略安装步骤截图了,相信各位都已装好了,下图为查看版本结果: 二 ...

  9. 搭建vue-cli4.0项目

      ① Vue CLI的包名称由 vue-cli 改成了 @vue/cli. 如果已经全局安装了旧版本的 vue-cli(1.x或2.x), 你需要先通过 npm uninstall vue-cli ...

随机推荐

  1. dubbo使用问题

    新入职此公司, 发现公司使用的框架原来是传说中的分布式的(原谅我以前在传统公司工作,并远离浪潮久矣), 使用过程中发现各服务之间使用 dubbo 进行通信. 特地总结下遇见的坑,为以后总结经验.   ...

  2. day39 Pyhton 并发编程02 后

    一.开启子进程的另一种方式 import os from multiprocessing import Process class MyProcess(Process): def __init__(s ...

  3. 正式班D9

    2020.10.16星期五 正式班D9 一.vmware workstation的使用 虚拟机管理软件 定义 虚拟机(Virtual Machine)软件是一套特殊的软件,它可以作为操作系统独立运行, ...

  4. pyquery 匹配NavigableString

    pyquery 匹配NavigableString不像xpath那样精确找打匹配对象,只需匹配包含NavigableString的根节点

  5. python 递归求和

    例子: 1 mylist = [1,2,3,4,5] 2 def func(var): 3 if var == []: 4 print('列表为空') 5 return 0 6 return var[ ...

  6. mac安装go环境

    下载pkg文件 https://golang.google.cn/dl/   sudo vim /etc/profile export GOROOT=/usr/local/go export GOPA ...

  7. 为什么堆化 heapify() 只用 O(n) 就做到了？

    heapify() 前面两篇文章介绍了什么是堆以及堆的两个基本操作,但其实呢,堆还有一个大名鼎鼎的非常重要的操作,就是 heapify() 了,它是一个很神奇的操作, 可以用 O(n) 的时间把一个乱 ...

  8. Codeforces Round #427 (Div. 2) E. The penguin's game （交互题，二进制分组）

    E. The penguin's game time limit per test: 1 second memory limit per test: 256 megabytes input: stan ...

  9. Python包安装及使用指南

    这里长期更新一些Python第三方包的安装教程,以及使用教程... Pygame 安装教程: Windows: 首先,查看已安装的Python版本:访问https://www.lfd.uci.edu/ ...

  10. JS里各种类型的循环

    for... for( 初始条件; 判断条件; 递增条件 ) { ... } for ... in 可以把一个对象里面的所有属性依次循环出来 var person = { name: 'Jack', ...