Vue框架学习记录

概览


准备工作

安装环境准备

复制代码
#安装node.js
#安装npm
#安装vue cli

基于脚手架创建前端工程


方式一

复制代码
#创建一个保存vue项目的目录,如vue_project
#在vue_project下进入cmd
vue create vue-demo-1


方式二

复制代码
#在cmd下输入
vue ui
复制代码
选择vue2
复制代码
#成功之后的界面
复制代码
#打开浏览器,选择界面的左上角vue-project
#跟着上面做的,应该是vue-demo-1
#点击红色选中的Vue项目管理器
c 复制代码
#第一个红色框选中的是存放vue项目的总合集
#选择你自己创建的项目合集即可
#点击第二个红色框"在此创建项目"
复制代码
#项目文件夹,如vue-demo-2
#包管理器 npm
#GIt 勾选上
#点击下一步

#选中Vue2

#创建项目

复制代码
#可查看项目依赖和配置

项目结构解析

启动前端项目

复制代码
#在当前项目路径下npm run serve
#命令行和VsCode的终端都行
bash 复制代码
#npm run serve的"serve"取决于package.json的scripts下的配置
#如下面红色框所示

更改前端端口

bash 复制代码
#在vue.config.js里添加
devServer: {
	port: 7070
}
相关推荐
小天源5 小时前
智叟云集系统架构解析:从品牌 AI 可见度监测到前后端协同
人工智能·react.js·系统架构·node.js·react·ai监测·ai品牌监测
迪幻12 小时前
封装自己的 npm 依赖并存储到个人 GitHub
前端·npm·github
用户61227166502413 小时前
电费 9 毛/天:我让一台 9 年前的旧 MacBook 替我上班,它比入门云服务器还能打
node.js
PegasusYu14 小时前
Node.js使用nedb轻量级数据库测试脚本
数据库·electron·node.js·脚本·测试·轻量级·nedb
Amos_Web15 小时前
Rspack 源码解析(二十五):CssParserAndGenerator 如何把 CSS 变成可 Tree Shaking 的模块
前端·rust·前端框架
WebInfra16 小时前
Rsdoctor 2.0 发布:Agent 驱动的全自动优化工具
前端·javascript·node.js
DevUp1 天前
标着 JavaScript 的 Wiki 与知识库:既不是 CMS 也不是 SSG(番外三)
javascript·node.js·cms
看浪的路人1 天前
第2讲:ReAct 模式从零实现——不用框架,手写一个 Agent 内核
前端·react.js·前端框架
毕业设计7031 天前
(免费领源码)基于node的学生公寓管理系统06412- java、PHP、python、C#、小程序、大数据、单片机、网络工程等)
vue.js·mysql·node.js·maven·mybatis·express·b/s
冒险的豆子2 天前
Vue2 、Vue3 响应式对比及优劣
vue