npm init vite@latest
项目名字是abcde,选了vue-ts
cd abcde
npm install
npm run dev
浏览器访问,结果是空白的,这是怎么回事?

后来发现是浏览器版本的问题,低版本浏览器不支持js的高级语法。

方法一:换成高版本浏览器就没问题了。如下:


方法二:降低vite的版本。npm init vite@2.8.0就行。

这两种方法都可以解决vite,npm run dev白屏的问题。建议采用方法一,直接更新浏览器版本。

npm init vite@latest; 项目名字是abcde,选了vue-ts; cd abcde; npm install; npm run dev;浏览器访问,结果是空白的,这是怎么回事?的更多相关文章

  1. vue 项目npm run dev ip访问

    webpack npm run dev 不能通过ip访问 只能通过localhost访问 解决方法如下: 修改vue-cli: config/index.js 文件 把文件中 host 的值,改成 i ...

  2. VUE学习(一)——使用npm安装项目

    npm是node.js自带的功能 Node.js 安装配置 本章节我们将向大家介绍在 Windows 和 Linux 上安装 Node.js 的方法. 本安装教程以 Node.js v4.4.3 LT ...

  3. 什么,你还使用 webpack?别人都在用 vite 搭建项目了

    一.vite 到底是干嘛的? vite 实际上就是一个面向现代浏览器,基于 ES module 实现了一个更轻快的项目构建打包工具. vite 是法语中轻快的意思. vite 的特点: 1.轻快的冷服 ...

  4. 使用npm init快速创建web 应用

    一般来说我们会有npm init -y 快速生成package.json 文件, 但是npm init 可以使用脚手架工具,生成项目,比较方便 参考 npm init 帮助命令 npm init [- ...

  5. [NPM] Create a new project using the npm init <initializer> command

    Historically, the npm init command was solely use to create a new package.json file. However, as of ...

  6. 使用“npm init”初始化项目

    使用npm init初始化项目 为什么要使用npm init初始化项目 在node开发中使用npm init会生成一个pakeage.json文件,这个文件主要是用来记录这个项目的详细信息的,它会将我 ...

  7. 图文并茂quasar2.6+vue3+ts+vite创建项目并引入mockjs,mockjs 拦截ajax请求的原理是什么,quasar为什么要使用boot?

    每天都要开心(▽)哇: 首先呢,我们来创建项目 执行下面命令,开始创建项目啦 $ npm i -g @quasar/cli $ npm init quasar 下面是我的选项,仅供参考哇 √ What ...

  8. egg源码浅析一npm init egg --type=simple

    要egg文档最开始的时候,有这样的几条命令: 我们推荐直接使用脚手架,只需几条简单指令,即可快速生成项目: $ mkdir egg-example && cd egg-example ...

  9. vite的项目,使用 rollup 打包的方法

    官网资料 构建生产版本--库模式 https://cn.vitejs.dev/guide/build.html#library-mode 详细设置 https://cn.vitejs.dev/conf ...

  10. 小tips:你不知道的 npm init

    前言 在现代新建一个 JS 相关的项目往往都是从 package.json 文件开始的,不过这个文件里需要的字段实在是太多了,正常人都记不住,所以 npm 官方提供了 npm init 命令帮助我们快 ...

随机推荐

  1. Python第四章实验报告

    一.实验项目名称:<零基础学Python>第四章的14道实例和4道实战 二.实验环境:IDLE(Python 3.9 64-bit) 三.实验目的和要求:熟练掌握Python序列的应用 四 ...

  2. StoneDB 子查询优化

    StoneDB 子查询优化 摘要: 说明如何优化 exists 的 join 查询优化器的处理 核心函数: TwoDimensionalJoiner::ChooseJoinAlgorithm Join ...

  3. LaTeX in 24 Hours - 3. Formatting Texts I

    文章目录 本章内容:文本格式 I 3.1 Sectional Units 3.2 Labeling and Referring Numbered Items 3.3 Texts Alignment 3 ...

  4. wx.BoxSizer布局管理器用法,及其Add()方法参数说明

    wx.BoxSizer 布局管理器是一种常见的布局管理器,它可以在水平或垂直方向上布置子窗口部件.同时,它还可以在水平或垂直方向上包含其他 wx.BoxSizer 来创建复杂的布局. 下面是 wx.B ...

  5. Python自动化环境搭建轻轻松松---selenium

    其实安装selenium实现自动化搭建环境也不拿 一共四步 1.Python开发环境 2.安装selenium包 3.安装浏览器 4.安装你安装的浏览器驱动 一: 想要实现Python环境不可能缺席: ...

  6. Solon2 接口开发: 强化 Gateway 模式

    一般可以从这几方面对 Gateway 模式进行强化: 定制异常状态码 定制基类 将一些处理独立封装成类 接口只返回数据部份,异常状态用抛 强化之后,具体的网关即简单,又功能强大.同时会对团队开发形成一 ...

  7. Flink基本概念及架构

    1.基本概念 无界和有界数据.任何类型的数据都可以形成一种事件流.信用卡交易.传感器测量.机器日志.网站或移动应用程序上的用户交互记录,所有这些数据都形成一种流.数据可以被作为 无界 或者 有界 流来 ...

  8. 【Eolink】Apikit V10.8.0 版本发布!增加支持 DUBBO、TCP、SOAP 、HSF、UDP 的接口协议

    Apikit 最新功能来袭! 我们在这个版本实现了接口管理和测试能力的全面升级,包括且不限于: 新增功能速览: 增加支持 DUBBO.TCP.SOAP .HSF.UDP 接口文档和协议 接口文档可自动 ...

  9. C++类的构造函数、析构函数、拷贝构造函数、赋值函数和移动构造函数详细总结

    目录 1. 五种函数介绍 2. 左值&右值怎么区分?怎么看? 3. 匿名对象的3种使用情况 4. 代码详细验证每个函数调用情况 4.1 测试 f_1 函数(函数形参测试 -- 值传递) 4.2 ...

  10. window.onload / onscroll/onresize 事件

    onload当文档加载完成后执行一些操作 window.onload = function(){ console.log("页面加载完成") } onscroll当页面发生滚动时执 ...