我的账户
猩码学苑

专注C++开发菁英教育

亲爱的游客,欢迎!

已有账号,请

如尚未注册?

vue-cli使用2023.6.28

[复制链接]
霁后彩虹O 发表于 2023-6-29 00:06:53 | 显示全部楼层 |阅读模式 打印 上一主题 下一主题
今日学习内容:


vue-cli创建项目
1. 创建项目

      vue create music

       初始化HTML中的代码

目标:解决浏览器兼容问题,SEO(TKD),网页快捷图标等。

puclic/index.html的**header**中加入下列代码,讲引用的图标拷贝到public目录

public中的文件不会被webpack处理
步骤:
1 删除自动生成的文件:public文件夹,src文件下的5个文件夹,assets。。

2 修改**public/index.html**
3 修改**src/main.js** 文件

其中用了一个新的方法**render**,和之前的区别就是 会替代app的区域。

1.Vue渲染组件的两种方式
1.1 先定义注册组件, 然后在Vue实例中当做标签来使用
1.2 先定义注册组件, 然后通过Vue实例的render方法来渲染

2.两种渲染方法的区别
1.1 当做标签来渲染, 不会覆盖Vue实例控制区域
1.2 通过render方法来渲染, 会覆盖Vue实例控制区域

4修改eslint配置文件.eslintrc.js
安装vs插件:

vetur 的特性: 语法高亮, 代码片段 (emmet 给我的感觉是一个写好了的 snippet), 质量提示 & 错误、格式化 / 风格、智能提示等
2. LESS和SASS文件后缀名区别
​    LESS以.less结尾
​    SASS以.sass或者.scss结尾
​    两种不同结尾方式区别: .sass结尾以缩进替代{}表示层级结构, 语句后面不用编写分号
​            .scss以{}表示层级结构, 语句后面需要写分号
​             企业开发中推荐使用**.scss结尾**
​    注意点: scss需要大括号和分号结尾。
     导入其他SASS文件
​    1 .scss文件中导入其它.scss文件
​    和LESS一样SASS文件中也支持导入其它SASS文件
​    其实原生的CSS也支持通过@import导入其它的CSS文件, 只不过不常用
​    不常用的原因在于原生的@import导入其它的CSS文件,
​    只有执行到@import时浏觅器才会去下载对应 css文件,这导致请求次数变多,页面加载起来特别慢
​    而LESS和SASS中的@import是直接将导入的文件拷贝到当前文件中生成一份CSS, 所以只会请求一次, 速度更快。







回复

使用道具 举报

关注0

粉丝0

帖子59

发布主题
大家都在学
课堂讨论
一周热帖排行最近7x24小时热帖
关注我们
专注C++菁英教育

客服电话:18009298968

客服时间:9:00-21:00

猩码学苑 - 专注C++开发菁英教育!( 陕ICP备2025058934号-1 )

版权所有 © 陕西菁英数字科技有限公司 2023-2026