vue的简介及@vue/cli 脚手架的使用示例
更新时间：2022年12月06日 10:29:42 作者：葒芢館7点7
vue 是一个 渐进式的javascript框架，脚手架是一个通用概念，帮助搭建项目的工具，本文以vue2为例结合实例代码给大家详细讲解，感兴趣的朋友跟随小编一起看看吧
1.vue简介：
vue 是一个 渐进式的 javascript 框架！
官网地址: Vue.js - 渐进式 JavaScript 框架 | Vue.js
Vue是一个MVVM的框架 （MVVM：一种软件架构模式）
2.脚手架：脚手架是一个通用概念，帮助搭建项目的工具（以vue2为例）
什么是vue脚手架呢？
vue官方提供的一个全局命令工具，可以 快速创建一个vue项目 的基础架子
vue脚手架的基本使用：
打开命令行、依次输入
1. 全局安装，输入如下命令：（tip：要先提前安装好node.js的包管理工具npm哦）
npm i @vue/cli -g 或 yarn global add @vue/cli
2. 查看vue版本：
vue --version 或 vue -V
3. 初始化一个vue项目，并选择版本，小编选择的是vue2版本：
vue create 项目名（不能用中文）
创建项目后会生成项目目录结构，脚手架项目里各个文件及代码都有什么作用呢?
4.切换目录进入项目根目录，并运行项目。
cd 项目目录 npm run serve //npm run的命令都在package.json
项目启动后就可以在浏览器输入下面地址访问项目了
如何覆盖脚手架下的webpack配置：
1. 注意：我们在项目无法找到webpack.config.js文件，因为vue把它隐藏 了 。
2. 如果需要覆盖webpack的配置，可以修改vue.config.js文件，覆盖webpack配置vue.config.js文件
如果端口号被占用无法访问项目，可以在vue.config.js文件中修改端口号：
const { defineConfig } = require('@vue/cli-service')
module.exports = defineConfig({
transpileDependencies: true,
//修改端口号
devServer: {
port: 4090
},
//关闭代码检查，初学者建议添加，vue语法较严格，不添加可能有不必要报错提示
lintOnSave: false
})到此这篇关于vue的简介及@vue/cli 脚手架的使用的文章就介绍到这了,更多相关vue cli 脚手架使用内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！
相关文章
本篇文章主要介绍了基于vue实现分页/翻页组件paginator示例，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧2017-03-03
这篇文章主要介绍了vue中{{}},v-text和v-html区别与应用详解,本篇文章通过简要的案例,讲解了该项技术的了解与使用,以下就是详细内容,需要的朋友可以参考下2021-09-09
这篇文章主要介绍了解决vue跨域axios异步通信问题，非常不错，具有一定的参考借鉴价值 ,需要的朋友可以参考下2019-04-04
路由守卫，简单理解来说就是，当用户要进行一些操作时，我需要用户的一些信息或数据或行为，我判断过后，才会同意用户进行操作，说到这里，我想大家心里都或多或少有点理解了吧2023-01-01
这篇文章主要介绍了详解vue-cli项目在IE浏览器打开报错解决方法，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2020-12-12
这篇文章介绍了Vue.js中v-bind指令的用法，文中通过示例代码介绍的非常详细。对大家的学习或工作具有一定的参考借鉴价值，需要的朋友可以参考下2022-03-03
这篇文章主要介绍了vuex状态持久化在vue和nuxt.js中的区别说明，具有很好的参考价值，希望大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2022-04-04
这篇文章主要介绍了Vue3在history模式下如何通过vite打包部署白屏问题,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教2024-07-07
Element el-checkbox-group v-model不支持对象(object)解决方案
本文主要介绍了Element el-checkbox-group v-model不支持对象(object)解决方案，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2023-05-05
这篇文章主要为大家介绍了Vue2如何支持composition API示例详解，有需要的朋友可以借鉴参考下，希望能够有所帮助，祝大家多多进步，早日升职加薪2023-01-01
最新评论