您现在的位置是:网站首页>软件开发>前端技术栈>vuevue
通过vue-cli创建vue项目
风口下的猪2022-06-21【vue】
简介
一.安装node环境
二.安装vue
npm i -g vue
三.安装vue-cli脚手架
npm i -g @vue/cli
四.创建vue项目
在想要放置的文件目录中cmd,执行
vue create 项目名称
五、进入详细选择
(上下 方向键选择,空格键确定,enter进入下一步)
1、默认vue2版本和默认vue3版本都是有Eslint和Babel的,Eslint是代码规范的,Babel是将ES6转化为ES5的。(这边新手不建议安装有Eslint的,所以选择自主配置--最后一种)
(按 space 键来进行是否选择,一般建议以上已勾选的选择)
Babel:es6 转 es5
Router:路由
Vuex:数据容器,存储共享数据
CSS Pre-processors:CSS 预处理器,后面会提示你选择 less、sass、stylus 等
Linter / Formatter:代码格式校验(一般情况下默认勾选了,记得取消!!!)
2、选择vue版本--目前选择2版本
3、是否选择history路由模式,(这里选择“N”)
4、选择css预处理器,一般选择Less
5、Babel、ESLint 等工具会有一些额外的配置文件,这里的意思是问你将这些工具相关的配置文件写到哪里:
In dedicated config files:分别保存到单独的配置文件
In package.json:保存到 package.json 文件中
这里建议选择第 1 个,保存到单独的配置文件,这样方便我们做自定义配置。
6、是否将刚才的选择保存起来,下次可以直接用,一般选择N,可以根据自己需要选择
7、开始创建,创建完成后可以打开文件
命令: cd 项目名称 是选择定位到项目
命令:npm run serve 则是运行项目,运行的项目就是刚刚cd项目的项目
8、运行项目后,出现如下页面就算是创建成功啦
很赞哦! (0)
上一篇:vue组件化梳理 (1)组件注册
下一篇:vue.use()的作用是什么
相关阅读 (同一栏目)
- v-html和直接插值的区别
- vue.js中{{}}允许原生的js代码
- 事件修饰符
- v-for推荐写法 :key=
- {{}}和
- src、href等赋值,采用数据绑定方式时的“动态刷新”问题
- class动态绑定时,短分割线命名的class报错问题
- vue里ref ($refs)用法
- uniapp 如何禁止或监听默认返回事件
- 解决[Vue warn]:Error in render:
- created()和mounted()使用注意项
- this.$nextTick()
- can not resolve the wrapperDom
- vue中 props中的变量不能在less中使用
- vue.js阻止事件冒泡和默认事件
- Vue报错
- import ... from和import {} from 的区别
- icons
- vue组件化梳理 (1)组件注册
- 通过vue-cli创建vue项目
- vue.use()的作用是什么
- 【解决】控制台报错Uncaught TypeError: Object(...) is not a function at eval (vue-router.esm-bundler.js
- vue路由跳转了但界面不显示的问题及解决
- Vue 路由设置梳理 (1)安装及初始路由
- Vue 路由设置梳理 (2)路由规则编写
- Vue 路由设置梳理 (3)申明式路由跳转及编程式路由跳转
- Vue 路由设置梳理 (4)首页重定向
- vue-cli项目的前端跨域解决方案
- vue-cli项目proxy跨域,在线上针对A域名跨B域名情况失效的解决方法
- axios上传图片报500
- vue-cli项目,点击某个菜单后公共模板(header/footer/menu等)不见了,只有主体页面部分
- vue-cli项目中的404
- vue-cli项目,如何给页面设置网站title、keywords、description等meta信息
- vue-cli项目网站,如何设置网站图标
- npm 安装和卸载插件包
- vue项目中通过CDN方式引入外包js/css
- vue2.X版本使用summernote的坑
- vue中使用html2canvas的坑(1)网络图片空白
- vue中使用html2canvas的坑(2)最外层dom的border-radius失效
- vue中使用html2canvas的坑(3)画图片时不支持object-fit:cover的问题
- js调用外部vue中的methods
- vue-cli项目控制无token时页面重定向跳转到登录,注意循环堆栈问题
- vue中input标签上传本地文件或图片后获取完整路径,如E:\medicineOfCH\stageImage\xxx.jpg
- vue 中$t()的作用
- vue路由守卫中next方法的理解
- 全局路由 router.afterEach 与 router.beforeEach
- 独享路由 beforeEnter
- 组件内路由守卫 beforeRouteEnter和beforeRouteLeave
- 关于next({ ...to, replace: true })的理解
- mixin混入
- vue语法 `${ }` (模版字符串)
- 组件内通信利器provide/inject
- vue webpack性能优化(二) 优化方向确定
- Vue中的爷孙传值$attrs 和利用$listeners 孙爷传值
- 在vue中实现onShow生命周期函数
- vue中this.$router.back()、this.$router.go()的区别使用
- Vue中 keep-alive 详解
栏目目录
标签云
站点信息
- 文章统计:528篇
- 移动端访问:扫码进入SQ3R
