1.安装nodejs(建议最新版本)

下载地址:下载 | Node.js 中文网

在安装的过程中建议不要装在C盘,安装完成配置环境变量,并且建议讲缓存路径更改。

安装完成后通过查看nodejs版本和npm版本,在终端输入 npm --version 和node --version,如下图所示:

2.构建vite项目

官方文档地址:开始 {#getting-started} | Vite中文网 (vitejs.cn)

使用vite初始化一个项目:

npm

npm init vite@latest

Yarn

yarn create vite

运行之后

package json 命令解析

{
"scripts": {
"dev": "vite", // 启动开发服务器,别名:`vite dev`,`vite serve`
"build": "vite build", // 为生产环境构建产物
"preview": "vite preview" // 本地预览生产构建产物
}
}

3 安装Vue cli脚手架

npm install @vue/cli -g // 安装
vue create <project> // 创建项目

构建我们的cli 项目可以去对比一下。

.MathJax, .MathJax_Message, .MathJax_Preview { display: none }

Vue3系列1--配置环境和创建项目的更多相关文章

  1. Anaconda配置环境变量+创建虚拟环境+pycharm使用虚拟环境

    Anaconda配置环境变量+创建虚拟环境 配置环境变量 没有添加系统变量,所有系统根本识别不了conda命令,找不到位置,所以添加以下系统变量: 添加对应Anaconda环境变量:(以自己的安装路径 ...

  2. 【Hexo】(一)使用HEXO配置环境,创建Hello World

    现场直播,呵呵,就是我完成一步,就记录一下: 一.配置环境 1.安装 Node 下载地址:Node.js 2.安装 Git(win环境下) 下载地址:Git Git 绑定 GitHub账户: ①打开G ...

  3. Maven的安装配置及初次创建项目与java单元测试工具JUnit

    Maven  安装     1.把maven安装包解压到某个位置     2.配置M2_HOME环境变量指向这个位置 3.在path环境变量中添加;%M2_HOME%\bin 配置镜像 国内的阿里云镜 ...

  4. vue搭建环境并创建项目

    1.>npm install @vue/cli -g 2.创建项目A a.>vue ui b.在弹出的管理界面创建项目 或 a.npm install -g @vue/cli-init b ...

  5. Scrapy教程——搭建环境、创建项目、爬取内容、保存文件

    1.创建项目 在开始爬取之前,您必须创建一个新的Scrapy项目.进入您打算存储代码的目录中,运行新建命令. 例如,我需要在D:\00Coding\Python\scrapy目录下存放该项目,打开命令 ...

  6. vue.js在windows本地下搭建环境和创建项目

    Vue.js是一套构建用户界面的渐进式框架.与其他重量级框架不同的是,Vue 采用自底向上增量开发的设计.Vue 的核心库只关注视图层,并且非常容易学习,非常容易与其它库或已有项目整合.另一方面,Vu ...

  7. Python小白学习之路(二)—【Pycharm安装与配置】【创建项目】【运算符】【数据类型】

    写在前面: 第二天的学习,感觉比昨天学习相对轻松一些,但是对于我这个编程语言功底很弱的人来说,还是稍稍微有些.....哈尔滨的天气一天天冷了下来,还飘着小雨,不过还是挺有意境的.充实而又忙碌的生活,让 ...

  8. cocos2d-x v3.0各个环境下创建项目以及编译、执行官方DEMO

    摘自:https://github.com/cocos2d/cocos2d-x/ 怎样创建一个新项目 How to start a new game Download the code from co ...

  9. Linux下搭建.NetCore3.0环境及创建项目

    ================================================== ================================================= ...

随机推荐

  1. VMware-workstation 安装步骤

    目录 VMware Workstation简介 软件获取 百度网盘获取 VM激活码: 安装步骤: VMware Workstation简介 VMware Workstation(中文名"威睿 ...

  2. BFC 是什么?

    BFC 是什么? 本文写于 2020 年 7 月 17 日 总有同学问我:"这个 div 为什么会插出来?为什么 float 的 div 这么不好操作?".这其实就是没有深入理解 ...

  3. unity---监听物体被点击

    脚本 public void OnPointerClick(PointerEventData eventData) { Debug.LogFormat("{0} is Click" ...

  4. unity---脚本创建文本

    脚本创建文本 新建文件夹 Resources 方便引用字体 在文件Resources中新建Fonts,并且下载一个ttf字体 没有字体,文本内容无法显示 脚本如下 public GameObject ...

  5. 文件操作(Java)

    学习内容:文件操作        1.输入流:InputStream类是字节输入流的抽象类,常用的一些方法有: raed()方法:从输入流中读取数据的下一个字节 reset()方法:将输入指针返回到当 ...

  6. React中render Props模式

    React组件复用 React组件复用的方式有两种: 1.render Props模式 2.高阶组件HOC 上面说的这两种方式并不是新的APi. 而是利用Raect自身的编码特点,演化而来的固定编码写 ...

  7. BUUCTF-爱因斯坦

    爱因斯坦 16进制打开可以看到存在压缩包,使用binwalk分离出来 提示需要解压密码,按照常理爆破四位数纯数字没有出来,查看图片属性发现密码 得到flag

  8. 记住这几个git命令就够了

    git clone: 下载初始化git add:添加git commit -m ' ' :提交 带消息git push:推送git pull: 拉取 git config --global user. ...

  9. Python Excel 操作

    1.Excel Code import os import time import re import win32com.client def dealpath(pathname='') -> ...

  10. mysql InnoDB通过.frm和.ibd恢复表和数据

    ibdata1是一个用来构建innodb系统表空间的文件,这个文件包含了innodb表的元数据.撤销记录.修改buffer和双写buffer.如果file-per-table选项打开的话,该文件则不一 ...