VUE脚手架初始化学习心得

最新推荐文章于 2024-10-29 09:45:21 发布
原创 最新推荐文章于 2024-10-29 09:45:21 发布 · 762 阅读 · 2 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#vue

本文详细介绍使用 vue-init webpack 初始化 Vue 项目的步骤，并提供避免 ESLint 报错的方法。此外，还介绍了初始化完成后项目的文件结构。

1.初始化项目

  • vue init webpack 新建项目名称
    • 初始化项目前一定要先安装vue-cli
    • 如果是小白最好不要用ESLint,否则会报很多语法错误,如果想尝试安装了碰到坑也可以在项目里关闭,如下图:这里写图片描述
    • 初始化完成跟着步骤走,如下图这里写图片描述
    • 已完成初始化,如下图这里写图片描述

2.文件结构介绍

这里写图片描述
这里写图片描述

最全vue脚手架搭建教程
suny8的专栏
06-23 1368
Vue CLI是一个基于Vue.js进行快速开发的完整系统，可以自动生成Vue.js+ webpack的项目模板。Vue CLI提供了强大的功能，用于定制新项目、配置原型、添加插件和检查webpack配置。@vue/cli3.x版本可以通过 vue create 命令快速创建一个新项目的脚手架，不需要像vue2.x那样借助于webpack来构建项目。
第 3 章：使用 Vue 脚手架
2203_75300307的博客
10-11 1892
1. 初始化脚手架 1.1 说明 Vue 脚手架是 Vue 官方提供的标准化开发工具（开发平台）。 最新的版本是 5.x。 文档: https://cli.vuejs.org/zh/ 1.2 具体步骤 第一步（仅第一次执行）：全局安装@vue/cli。 npm install -g @vue/cli 第二步：切换到你要创建项目的目录，然后使用命令创建项目 vue create xxxx（项目名称） 第三步：启动项目 npm run serve 备注： 如出现下载缓慢请配置 npm 淘宝镜像： np
基于vue-cli（vue脚手架）搭建Vue项目总结
Ho_mj的专栏
05-24 923
基于vue-cli（vue脚手架）搭建Vue项目总结 一、运行环境 node (v8.12.0) (官网下载安装)+ npm(Node.js的包管理工具) (6.4.1) + Vue（构建用户界面的渐进式框架）(2.9.6) + Intellij IDEA 在之前已安装过node 、npm(n...
Vue CLI 初始化脚手架详解
半夏_2021的博客
06-17 353
Vue CLI 初始化脚手架详解
Vue学习之初始化脚手架
AtlantisPrincess的博客
06-05 480
Vue学习之脚手架初始化
Vue与Ant Design Vue学习心得与实战技巧
Vue-CLI是一个命令行工具，用于快速搭建Vue项目，它提供了预配置的脚手架，简化了项目初始化和构建流程。 使用Vue-CLI构建项目，首先需要安装全局Vue CLI，然后创建新项目，选择模板，最后启动服务进行开发。Vue...
Vue学习总结(更新中)
是日前端
05-19 3440
一、Vue的基本使用及模板语法 1、Vue简介     1.1 Vue是一套用于构建用户界面的渐进式框架： 声明式渲染—>组件系统—>客户端路由—>集中式状态管理—>项目构建     1.2 优点： 易用：熟悉HTML、CSS、JavaScript知识后，可快速上手Vue 灵活：在一个库和一套完整框架之间自如伸缩 高效：20kB运行大小，超快虚拟DOM 2、Vue的基本使用  &
购物车案例总结（vue3+vue-router+pinia+element-plus）
qq_50280292的博客
01-10 1586
简单购物车案例
精选资源
《vue开发教程&案例》
06-07
它内置了Webpack等现代构建工具，并提供了图形化界面，简化了项目初始化过程。 #### 二、Vue.js 学习资源 1. **Vue.js 官方文档**： - **网址**：[Vue.js Official Documentation](https://vuejs.org/v2/guide/) ...
vue3项目开发总结
最新发布
Yr123456_的博客
10-29 987
这个Vue组件模板页面通过组件化、插槽机制、响应式数据管理和自定义参数传递等方式，实现了一个功能丰富、灵活可复用的列表查询页面。在实际项目中，可以根据具体需求对组件进行进一步的优化和扩展。2、自定义hook一个利用 Vue3 的组合式 API 来封装和复用具有状态逻辑的函数。通过封装有状态的函数，极大提高了组件的编写效率和维护性。提取一个用于获取码表数据并将其存储在响应式对象中的hook在项目的某个文件夹中（例如src/hooks），创建一个新的 JavaScript文件。
Vue脚手架初始化&脚手架结构分析
路人的博客
08-24 528
安装@vue/cli之后，电脑中多了一个vue命令，以后通过vue命令进行创建脚手架。第二步：切换到你要创建项目的目录，然后使用命令创建项目。xxxx是自定义项目名称。第一步 （仅第一次执行）全局安装@vue/cli。翻译过后，开启一个内置的8080端口的服务器。速度慢的话：需要 npm 设置淘宝镜像。HelloWorld的演示。
vue-cli脚手架初始化vue项目
moon_tang的博客
07-26 1273
vue-cli就是Vue的脚手架工具，他帮助我们搭建基本的开发环境，利用它可以搞定项目目录，本地调试，单元测试及代码部署等等。 一、创建项目 参考网址（vue如何新建一个项目（超详细哦）） https://www.jianshu.com/p/02b12c600c7b 1、安装 vue-cli cmd npm install vue-cli -g 2、cmd,进入要创建文件的位置 例如我要在桌面上...
Vue知识点整理（三）- Vue脚手架（1）- 初始化Vue脚手架、简单分析Vue脚手架结构
JHY97的博客
04-16 1613
目录 一、初始化Vue脚手架 二、简单分析脚手架结构 一、初始化Vue脚手架 第一步（仅执行一次）：全局安装 @vue/cli 在 命令提示符内输入（命令提示符 可由 win+R 调出 运行 界面，输入cmd 即可） npm install -g @vue/cli 下载速度过慢的话，建议配置npm淘宝镜像 npm config set registry https://registry.npm.taobao.org 第二步：切换到你要创建项目的目录，然后使用命令创建项目，并选择vu
Vue脚手架Ⅰ（初始化脚手架，render函数，修改默认配置，ref属性）
weixin_51249285的博客
11-10 1582
使用Vue脚手架 1.初始化脚手架(说明，具体步骤，分析脚手架结构，一些配置文件，src(重要)，public） 2.render函数(引入完整版的vue（带有解析模板器的vue），render函数渲染，关于不同版本的Vue） 3.修改默认配置 4.ref属性
Vue学习心得（1）
a253399414的博客
10-09 1871
** Vue 的安装方式 ** 下载使用（两种方式） 1.直接下载并用script标签引入，Vue 会被注册为一个全局变量，平时对于 Dom 操作比较频繁的小项目可以直接这样使用。 2.Vue.js 提供一个官方命令行工具，可用于快速搭建大型单页应用。该工具提供开箱即用的构建工具配置，带来现代化的前端开发流程。只需一分钟即可启动带热重载、保存时静态检查以及可用于生产环境的构建配置的项目：针对单页应用的构建推荐使用这种方式，可以更好的体验到 vue 所提供的组件化功能 （单文件组件），顺带着享受到 webpa
Vue 脚手架CLI 初始化项目
有勇气的牛排博客
02-07 1456
1 介绍 CLI是Command-Line Interface，翻译为命令行界面，但是俗称脚手架。 Vue CLI是一个官方发布vue.js项目脚手架 使用vue-cli可以快速搭建vue开发环境以及对应的webpack配置。 使用vue-cli可以快速搭建vue开发环境以及对应的webpack配置 2 Vue CLI使用前提 Webpack Vue.js官方脚手架工具就使用了webpack模板 对所有的资源会压缩等优化操作 它在开发的过程中提供了一套完整的功能，能够使得我们开发
19.初始化vue脚手架
weixin_43893483的博客
07-23 2316
初始化vue脚手架
Vue脚手架学习心得
LX20190110的博客
07-09 539
学习vue,我在打包的时候报了下列错误 4:23 error Strings must use singlequote quotes 5:8 error Strings must use singlequote quotes 11:1 error Expected indentation of 2 spaces but found 4 indent 12:1 error Expected indentation
Vue —— 进阶脚手架（零）（初始化【附案例】）
HuoZhiyan 的博客
03-23 1775
脚手架的创建过程，附一个实例。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值