vue-cli3搭建项目

Jenny_Tong 发布于2019-08-23 13:53 / 1292人阅读

摘要：中文文档在安装之前请装好安装检测的版本大写安装的安装方法安装全局桥插件能兼容使用命令行创建项目快速创建一个新项目创建项目选择配置选择配置第一次创建项目只有后面两个分别是默认和手动自定义选择。

中文文档
https://github.com/vuejs/vue-...
在安装之前请装好nodeJs

安装vue cli3 1. 检测vue 的版本

vue -V (V大写)
or
vue --version

2. 安装@vue/cli

npm install -g @vue/cli  (ps: vue cli2的安装方法 npm install -g vue-cli )

安装全局桥插件,能兼容使用vue cli2

npm install -g @vue/cli-init

cmd命令行创建项目 1. 快速创建一个新项目

vue create name (vue-cli2创建项目：vue init webpack name )

2. 选择配置

(1). 选择配置,第一次创建项目,只有后面两个,分别是默认和手动自定义选择。第一个是我创建过后保存的,这里选择最后一个,手动选择配置

(2). A全选,空格键选择与取消,上下移动

(3). 选择css预处理器,这里是选择less

(4). eslint校验方式,这里选择最后一个

(5). 什么时候进行校验,这里选择每次保存的时候进行校验

(6). 把babel,postcss,eslint这些配置文件放哪。放在各自的配置文件里 or 放在package.json,这里选择放在各自的配置文件里

(7). 把刚刚选择的配置文件保存 or 不保存,保存之后就会出现在每次创建项目选择配置时,这里选择yes,然后取个配置的名字

(8). 按回车就开始下载@vue/cli框架,并初始化项目了

(9). 启动项目

 npm run serve (vue-cli2启动项目：npm run dev)

切换项目目录,运行,项目就启动了

GUI界面创建项目

可以在官方自带的图形界面上创建项目，运行项目

1.启动GUI界面

 vue ui

2.点击创建新项目,输入项目名字,包管理器选择npm

3.选择项目配置就可以下载@vue/cli,创建新项目了,这里选择之前保存的

4.任务=>serve 点击运行就可以相当于启动项目了 npm run serve 了, 可以点击输出查看控制台结果

配置vue.config.js

@vue/cli3搭建的新项目,没有vue-cli2 的build和config文件夹
所以有什么配置可以在根目录新建一个vue.config.js写上配置项
这里是修改接口和关闭eslint检查

module.exports = {
  lintOnSave: false,
  devServer: {
    port: 8081
  }
}

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/99722.html

vue-cli2.0转3.0之项目搭建

摘要：因为项目技术架构需要，要用进行搭建，所以简单的分享下如何优雅的开始。第三步创建项目相对，创建就不是之前一大堆了。直接，是项目名字。但是个人建议，进行多选，根据自己需要进行选择。根据提示，运行一把一下，跑起来的感觉很棒。因为项目技术架构需要，要用vue-cli 3.0进行搭建，所以简单的分享下3.0如何优雅的开始。下面做一下简单的介绍，希望可以帮到有需要的朋友。 vue-cli 3.0...

Zhuxy 2019-08-23 13:59 评论0 收藏0
vue-cli3 搭建的前端项目基础模板

摘要：基于搭建的前端模板，本仓库，即可搭建完成一个新项目的基础模板，源码地址，欢迎或特性预编译语言，做了一定的封装，详见雪碧图移动的适配方案引入了及，可以自由地用去开发常用的工具类引用全局注入相关的文件，如通用的及等常用的的集合支持基于 vue-cli3 搭建的前端模板，clone 本仓库，即可搭建完成一个新项目的基础模板，源码地址，欢迎 star 或 fork 特性 CSS 预编译语言...

william 2019-08-26 12:24 评论0 收藏0
使用vue-cli脚手架+webpack搭建vue项目

摘要：查看安装是否正常回车后看到输出当前安装的版本号，例如，即安装正常通过以上步聚，说明已经安装完并能正常运行。再次用脚手架搭建项目第二步将模块安装完成后，就可以使用以下命令创建项目了。前言世间万难无非一拖二懒三不读书对说的就是我突然觉得这句话说的很对，自从上次写完nodejs安装及npm全局模块路径的设置已经过去两月有余，而我的vue框架学习也就止步于此。还是没有给自己施加压力...

dantezhao 2019-08-23 10:36 评论0 收藏0