工程化开发和脚手架

开发 Vue 的两种方式:

  1. 核心包传统开发模式:基于 html / css / js 文件,直接引入核心包,开发 Vue。
  2. 工程化开发模式:基于构建工具(例如:webpack ) 的环境中开发 Vue。


    工程化开发 & 脚手架 Vue CLI
    基本介绍:
    Vue CLI 是 Vue 官方提供的一个 全局命令工具。
    可以帮助我们 快速创建 一个开发 Vue 项目的 标准化基础架子 。【集成了 webpack 配置】
    webpack 配置:

    好处:
  3. 开箱即用,零配置
  4. 内置 babel 等工具
  5. 标准化
    使用步骤:
  6. 全局安装 (一次) : yarn global add @vue/cli 或 npm i @vue/cli -g
  7. 查看 Vue 版本: vue --version
  8. 创建项目架子: vue create project-name (项目名-不能用中文)
  9. 启动项目: yarn serve 或 npm run serve (找package.json)
    脚手架目录文件介绍 & 项目运行流程

相关推荐
IT_陈寒1 分钟前
明明设了默认值,为什么我的JavaScript函数参数还是undefined?
前端·人工智能·后端
CappuccinoRose2 分钟前
Web Components 基础
前端·javascript·交互·web component·shadow dom
晴天164 分钟前
前端 Monorepo 入门分享:从概念到实践
前端
lytao12319 分钟前
90% 覆盖率不等于没 Bug:用风险配置测试组合
前端·javascript·bug·软件工程
mayaairi23 分钟前
Vue2 组件通讯(一):Props传值完全指南
前端·javascript·vue.js
码艺-Alimjan25 分钟前
Tauri 2.x + Vue 3 桌面应用开发实战:从踩坑到完美落地
前端·javascript·vue.js·rust·typescript·go
AINative软件工程38 分钟前
编程
前端·llm
晴天1640 分钟前
peerDependencies 全面解析:前端依赖生态的核心机制与实战指南
前端·npm
I'mChloe40 分钟前
群晖部署 image-matting:把人像去背景做成一个随开随用的 Web 工具
android·前端
程序员蜡笔熊1 小时前
Vite 8 换芯实测:Rolldown 替掉双引擎,构建快 3.19 倍
前端·javascript·vue