工程化开发和脚手架

开发 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)
    脚手架目录文件介绍 & 项目运行流程

相关推荐
@yanyu6661 分钟前
04vue3基础
前端·javascript·vue.js
IT_陈寒9 分钟前
JavaScript 闭包陷阱:90%开发者踩过的5个坑,你中招了吗?
前端·人工智能·后端
SuperEugene15 分钟前
Vue3 Props 传参实战规范:必传校验 + 默认值 + 类型标注,避开 undefined / 类型混用坑|Vue 组件与模板规范篇
前端·javascript·vue.js·前端框架
im_AMBER18 分钟前
万字长文:编辑器集成Vercel AI SDK
前端·人工智能·react.js·前端框架·编辑器
Y君20 分钟前
面了3个人后我发现:AI用得最溜的,未必是我最想要的工程师
前端·人工智能·面试
一拳不是超人21 分钟前
2026年最值得关注的JavaScript新特性:Signals,响应式编程的下一个十年
前端·javascript·响应式编程
skiy22 分钟前
Webpack、Vite区别知多少?
前端·webpack·node.js
Luna-player25 分钟前
npm install vue-awesome-swiper@5.0.1 swiper@7.4.1安装后,我又想全删了,怎么移除
前端·vue.js·npm
大雷神27 分钟前
HarmonyOS APP<玩转React>开源教程二十:收藏功能实现
前端·react.js·开源·harmonyos
晓得迷路了29 分钟前
栗子前端技术周刊第 121 期 - Vitest 4.1、Nuxt 4.4、Next.js 16.2...
前端·javascript·vite