问题描述
最近,在安装完vue-router之后,在写ts的时候,出现下面的错误,起初我以为是版本不兼容,在重装了多次版本后还是没有解决,最后通过直觉告诉我是删除node_modules然后使用cnpm进行安装,后来通过这个方法解决了。
Error on importing VueAnalytics to main.ts in Vue CLI (Vue3)
解决办法
删除node_modules文件夹。
使用cnpm进行安装。
cnpm i
最近,在安装完vue-router之后,在写ts的时候,出现下面的错误,起初我以为是版本不兼容,在重装了多次版本后还是没有解决,最后通过直觉告诉我是删除node_modules然后使用cnpm进行安装,后来通过这个方法解决了。
Error on importing VueAnalytics to main.ts in Vue CLI (Vue3)
删除node_modules文件夹。
使用cnpm进行安装。
cnpm i
标题 | |
---|---|
快速打开Dev Tools | Ctrl + Shift + i |
打开命令菜单 | Ctrl + Shift + P |
快速打开Dev Tools | Ctrl + Shift + i |
快速打开Dev Tools | Ctrl + Shift + i |
快速打开Dev Tools | Ctrl + Shift + i |
快速打开Dev Tools | Ctrl + Shift + i |
快速打开Dev Tools | Ctrl + Shift + i |
快速打开Dev Tools | Ctrl + Shift + i |
快速打开Dev Tools | Ctrl + Shift + i |
dark theme
light theme
screenshot
dock to right
dock to left
dock to bottom
首先选中元素,然后在下面添加样式
选中目标元素然后点击下面的内容
选中目标元素点击cls
选中目标样式,然后点击copy styles
选中需要粘贴样式的位置,然后粘贴到下面的位置
这个tab栏主要记载了当前页面都应用了哪些样式,通过点击可以跳转到这些样式。
在Layout标签下可以调试Grid布局和Flex布局。
勾选flex元素可以给flex元素加上横线边框。
可以通过styles面板中的点击图标来测试flex的其他属性。
该面板可以查看当前页面所有的监听事件。
声明了“ React”,但从未读取其值。
因为是使用的基于TS的react模板脚手架,因此在安装依赖的时候,必须安装带有@types/xxx的文件。
npm install -D @types/react
博主在学习Next应用的时候,使用express作为后台,部署在本地一切正常,但是部署在字节的轻服务上便出现如下错误。
刚开始遇到这个错误,我判断可能是跨域问题,后来经排查不是,因为如果是跨域问题,自定义的路由不可能被访问成功,但是我通过postman访问自定义路由是能够成功的,说明不是跨域的问题,而且我已经配置了下面的语句。
app.use(cors()); // 解决跨域
因为只有静态资源无法访问,说明可能是配置静态资源的中间件出来问题,所以我刚开始在网上找到了这样的一个解决方案,即下面的语句。
app.use(express.static(path.join(__dirname, 'build', 'public')));
上面的解决也是无效,后来我咨询了字节轻服务的相关工程师,原来是因为path.join会拼接字符串,但是我的路径中并没有build这个文件夹,所以报错,我原本还以为这两个文件夹是并列关系,原来是拼接关系。
在字节轻服务工程师的帮助下,我才用了绝对路径的方式来公开静态资源,这一次成功了~感谢字节轻服务的工程师。
app.use(express.static(path.join(__dirname, 'public')));
在express公开静态资源的时候,如果不加入绝对路径,会按照云平台中的node执行的位置去找,自然会出现找不到的情况,自然会出现404的错误,但是我们如果加上了绝对路径dirname则会避免这个问题,直接找到这个资源的绝对路径。
今天在学习Flex布局的时候,首先定义了一个div盒子,但是页面竟然出现了三个div盒子,我首先想到可能是浏览器插件对样式进行了修改,后来果然是这样。
首先打开浏览器的网络页面。
清空所有的请求。
刷新页面。
任意点击一个非本地的请求,从Request URL中判断是哪个插件的请求。
原来是SurfingKeys这个插件修改了我们的样式,我们只需将该插件设置为点击时使用,即可恢复原状。
当我使用React脚手架创建一个项目后,发现保存代码后,浏览器并不会自动刷新,需要我手动刷新后,才会显示出来。
在package.json同级目录下新建一个文件名为.env,并添加下面的内容
FAST_REFRESH=false
href="javascript:;"
上面这段代码的存在。
使用href="/#"代替
虽然上述方法可以解决Rract的警告问题,但是可能会影响到页面跳转功能的实现,如果你想使用的是Link-Button的功能,可以考虑下面的方法
<Button type="link">Link Button</Button>
通过sort这个API对全是BigInt的数组进行排序导致的错误 sort((num1,num2) => num1 - num2)
使用下面的排序方式
sort((a, b) => (a < b) ? -1 : ((a > b) ? 1 : 0));