HTML、WebStrom和Vue使用

简介: HTML、WebStrom和Vue使用

WebStrom

WebStorm配置启动Vue项目

用WebStorm运行Vue项目

福利:不用跑项目就能查看组件效果

脚手架

nodeJS安装(超详细小白教程)

cnpm安装步骤

超级详细的Vue安装与配置教程

yarn 安装使用小记 (brew install yarn MAC上安装brew,一次性讲懂(必看))

yarnpkg ( yarn 一种取代npm的 Node的模块管理器 )

vite入门/徒手搭建vite/配置vite/使用vite脚手架/vite步骤

Vue Devtools for Chrome v5.3.5

npm基本操作及命令详解

npm 常用的命令

npm insall --sava-dev
# 包含 --sava-dev (npm install 包含 -D) : 安装的包只用于开发环境,不用于生产环境,会出现在 package.json 文件中的 dependenceies 属性中
 
npm insall --sava 
# 包含 --sava (npm install 包含 -S) :  安装的包需要发布到生产环境的,会出现在 package.json 文件中的 dependenceies 属性中

安装指定 axios指定版本

npm install axios@0.19.2 --save

axios的全局配置baseUrl

HTML

HTML - 标签自定义属性

JS

什么是自定义事件,内置属性与自定义属性的区分

Object.defineproperty方法(详解)

js模板字符串

Html第7集:debugger调试、Json

console.log 和 console.dir的区别

JS模块

ES6全部特性

【JavaScript】模块化规范

JS模块化规范

devDependencies和dependencies有什么区别呢

package.json简介

package.json 最全详解

Vue

Vue Api

Vue Router

vue3中的单文件组件<script setup>详解

Vue3父组件访问子组件数据 defineExpose用法

部署

VUE项目部署

vue 项目使用 vite工具,开发服务器配置 server.proxy 简要介绍(包含跨域配置)

Vite.config.ts最全配置

vue3.0 + vite 多环境打包 代理设置

vite项目、vue-cli项目环境配置

一文搞懂跨域的所有问题,生活从此669

# nginx 安装
# https://blog.csdn.net/qq_40179653/article/details/125736200
sudo apt install nginx
 
# https://blog.csdn.net/zouyang920/article/details/122876504
# nginx 启动
nginx
 
#  快速停止
nginx -s stop
 
# 完整有序停止
nginx -s quit
 
# 重启
nginx -s reload

Nginx反向代理配置

vue打包上线后nginx去除部分路径及反向代理

vue发布Nginx配置Https

# Settings for a TLS enabled server.
 
    server {
        listen       443 ssl http2;
        listen       [::]:443 ssl http2;
        server_name  xucz.vip;
        root         /home/doc;
 
        ssl_certificate "/var/lib/nginx/xucz.vip.pem";
        ssl_certificate_key "/var/lib/nginx/xucz.vip.key";
        ssl_session_cache shared:SSL:1m;
        ssl_session_timeout  10m;
        ssl_ciphers HIGH:!aNULL:!MD5;
        ssl_prefer_server_ciphers on;
        error_page 497 301 =307
 
        # Load configuration files for the default server block.
        include /etc/nginx/default.d/*.conf;
 
        location / {
        }
 
        error_page 404 /404.html;
        location = /404.html {
        }
 
        error_page 500 502 503 504 /50x.html;
        location = /50x.html {
        }
    }

vue项目上线优化之如何配置 HTTPS 服务

免费SSL证书申请进入 https://freessl.cn/ 官网,输入要申请的域名并选择品牌

springboot配置https

Springboot支持HTTPS教程(亲测有效)

springcloud配置https(使用自制证书)

SpringCloudGateway 支持https和http,微服务间http转发

SpringCloud Gateway Https设置 以Http 转发 路由 给后台微服务

JSX

JSX 语法详解

TypeScript

一文读懂TS的(.d.ts)文件

Node.js中模块查找规则

  1. 当模块拥有路径但没有后缀时
require('./find.js')
require('./find')


  • require方法根据模块路径查找模块,如果是完整路径,直接引入模块
  • 如果模块后缀省略,先找同名的js文件再找同名js文件夹
  • 如果找到了同名文件夹,就找文件中的index.js
  • 如果文件夹中没有index.js就会去当前文件夹中的package.json文件中查找main选项中的入口文件
  • 如果找指定的入口文件不存在或者没有指定入口文件就会报错:模块没有被找到
  1. 当模块没有路径且没有后缀时
require('find')
  • Node.js会假设它是系统模块
  • Node.js会去node_modules文件夹中
  • 首先看是否有该名字的js文件
  • 再找同名js文件夹,如果找到了同名文件夹,就找文件中的index.js
  • 如果文件夹中没有index.js就会去当前文件夹中的package.json文件中查找main选项中的入口文件
  • 如果找指定的入口文件不存在或者没有指定入口文件就会报错:模块没有被找到

nodejs模块查询规则

Node.js 模块寻址规则

Uni-app

uniapp 官网

navigator的open-type属性 可选值 'navigate'、'redirect'、'switchTab',对应于wx.navigateTo、wx.redirectTo、wx.switchTab的功能

open-type="navigate"等价于API的 wx.navigateTo 而wx.navigateTo的url是需要跳转的应用内非 tabBar 的页面的路径


open-type="redirect"等价于API的 wx.redirectTo 而wx.redirectTo的url是需要跳转的应用内非 tabBar 的页面的路径open-type="switchTab"等价于API的 wx.switchTab而wx.switchTab的url是需要跳转到 tabBar 页面,并关闭其他所有非 tabBar 页面


最后一个switchTab事件触发以后 把前面的页面都关闭了

open-type="switchTab"等价于API的 wx.switchTab而wx.switchTab的url是需要跳转到 tabBar 页面,并关闭其他所有非 tabBar 页面


最后一个switchTab事件触发以后 把前面的页面都关闭了


获取用户权限open-type="getUserInfo"

<button open-type="getUserInfo" @getuserinfo="bindGetUserInfo" @click="getUserInfo1">获取权限</button>


uni-app页面跳转的不同方式及差异

小程序黑马教程

参考

bootcdn



目录
相关文章
|
4月前
|
JavaScript 前端开发
【快捷键配置】常用HTML类名、CSS样式名称、JS方法变量名、vue代码片段
【快捷键配置】常用HTML类名、CSS样式名称、JS方法变量名、vue代码片段
|
4月前
|
安全 JavaScript Go
Vue中的v-html指令有什么潜在的安全风险?如何防范?
Vue中的v-html指令有什么潜在的安全风险?如何防范?
604 1
|
30天前
|
JavaScript 前端开发
基于Vue实现具有固定表头、合并单元格的Html表格
本文介绍了如何在Vue框架中创建一个具有固定表头和合并单元格功能的HTML表格,通过CSS的`position: sticky`属性实现表头固定,并通过设置`rowspan`和`colspan`属性来实现单元格合并。
13 0
基于Vue实现具有固定表头、合并单元格的Html表格
|
2月前
|
JSON JavaScript 数据格式
文本-----wangEditor的使用,设置和获取内容,展示HTML无样式怎么办????console同步展示怎样写,Vue的配置在Vue3配置文件中的配置,是editor中的v-model绑定的值
文本-----wangEditor的使用,设置和获取内容,展示HTML无样式怎么办????console同步展示怎样写,Vue的配置在Vue3配置文件中的配置,是editor中的v-model绑定的值
|
2月前
|
JavaScript 前端开发 CDN
vue 生成分享海报、下载图片(含生成二维码qrcodejs2的使用,网页截屏html2canvas的使用)
vue 生成分享海报、下载图片(含生成二维码qrcodejs2的使用,网页截屏html2canvas的使用)
27 0
vue 生成分享海报、下载图片(含生成二维码qrcodejs2的使用,网页截屏html2canvas的使用)
|
2月前
|
JavaScript
【vue】vue 里面使用 v-html 插入的文本带有换行符‘\n‘不换行
【vue】vue 里面使用 v-html 插入的文本带有换行符‘\n‘不换行
335 0
|
2月前
|
JavaScript 前端开发 物联网
文本,Vue实现打印的方式,打印机的种类有多少,浏览器打印html,右键,2打印插件,3指令打印,vue-print-nb
文本,Vue实现打印的方式,打印机的种类有多少,浏览器打印html,右键,2打印插件,3指令打印,vue-print-nb
|
2月前
|
JavaScript
html / vue 自动生成目录
html / vue 自动生成目录
23 0
|
3月前
|
JavaScript
VScode格式化vue文件--避免html属性换行
VScode格式化vue文件--避免html属性换行
213 0
|
4月前
|
存储 JavaScript 前端开发
笔.COOL,一个功能完备、使用便捷的在线HTML/CSS/JS以及Vue编辑器和作品分享平台
笔.COOL是一个新兴的在线 HTML/CSS/JS 及 Vue 编辑器,提供实时预览和云端存储功能。用户可以随时随地编写和保存代码,同时分享作品给他人预览和学习。它也是一个实用的 BUG 复现工具,支持嵌入编辑器到博客,促进代码交流。社区活跃,适合开发者展示作品、获取灵感和学习。