VUE CLI3.X 创建项目

Node.js环境搭建

  • Node.js基于V8引擎,可以让js代码脱离浏览器运行
  • Vue CLI3.0 需要Node.js 8.9或者更高版本。

    nvm或者nvm-windows在同一台电脑中管理多个Node版本

  • nvm github地址:https://github.com/nvm-sh/nvm

Vue CLI 3.0环境搭建

  • 卸载老版本vue-cli:npm uninstall vue-cli -g
  • 安装新版本:npm install -g @vue/cli
  • 原型开发:npm install -g @vue/cli-service-global
  • 创建项目:vue create hello-world
  • 使用图形化界面:vue ui

创建项目

  • 使用脚手架创建新项目,选择第二个,手动创建

    my-default:我原来保存好的模板;

    default:使用默认配置

    Manually select features:自定义配置

  • 选择需要的功能,上下键移动,空格是选中与取消,A是全选。选择完成以后,回车进行下一步

    ? Babel:ES6 转 ES5

    ? TypeScript:使用 TypeScript 书写源码

    ? Progressive Web App (PWA) Support:渐进式Web应用

    ? Router: 路由

    ? Vuex: 状态

    ? CSS Pre-processors:CSS 预处理

    ? Linter/Formatter:代码风格检查和格式化

    ? Unit Testing:单元测试。

    ? E2E Testing:E2E测试

  • 选择路由模式,这里使用hash模式。输入n,按回车键

  • 选择语法检测规范配置,一般使用标准配置即可

  • 语法检测方式,这里我选择保存就检测。

    ? Lint on save:保存时检查

    ? Lint and fix on commit:提交时检查

  • 这里问babel,postcss,eslint这些配置文件怎么存放。我们选第一个。

    ? In dedicated config files: 单独的文件
    In package.json:存放一个文件中(package.json),第一步中的默认模式选这个

  • 是否把这一次的选择作为预设,下次可以直接使用这套配置。键入N不记录,如果键入Y需要输入保存名字。

  • 确定后,等待下载依赖模块。
  • 项目创建完成以后,根据提示输入命令
    cd project-name // 进入项目根目录
    run serve // 运行项目

原文地址:https://www.cnblogs.com/tudou1179006580/p/11100112.html

时间: 2024-10-10 09:34:44

VUE CLI3.X 创建项目的相关文章

新手入门vue 使用vue-cli创建项目

本文是针对对于完全没有了解过vue 和npm,连运行环境和项目构建的都不会的小白,对于前端老司机的就不用看了,浪费时间. 使用npm 与vue-cli 构建vue 项目 第一步:安装运行环境(node与npm) nodeJ官网:http://nodejs.cn/ 下载安装包( 安装) 安装完成后,需要检测是否安装成功 使用命令行cmd  打开dos 黑窗口,运行 node  -v 和 npm –v,出现版号说明安装成功 注(npm 是node自带的,在安装node时已经安装了) 如何升级npm

vue利用vue ui命令创建项目

上次用git bash,用create 命令创建vue项目,这是玩个炫酷的------vue ui (前提是有安装node.js). 在目标文件  vue ui 可以看到他在8000端口出现了一个gui图形窗口 剩下的基本很友好.点击创建项目,会让填项目名称,选择包管理工具,是否上传git, 然后让选择预设.预设就是你的下载loader包的配置. 你如果想要彻底删除以前自己保存的预设,可以找c盘下的用户,搜索 .vuerc,把你不想要的预设删除就可以了. 最后一步点击创建项目,vue-cli 会

Vue 安装环境创建项目

vue 是一个单页面框架,基于模块化组件化的开发模式. 搭建开发环境之前必须要安装node.js,然后安装vue的脚手架工具(命令行工具)win + R 输入npm install  --global vue-cli(慢)或者cnpm install  --global vue-cli(快) 创建项目,vue init webpack  vuedemo01 (创建一个基于webpack为模版的命名为vuedemo01的项目) 1.你的名字是vuedemo01么 2.你的项目的描述是什么 3.作者

vue搭建环境并创建项目

1.>npm install @vue/cli -g 2.创建项目A a.>vue ui b.在弹出的管理界面创建项目 或 a.npm install -g @vue/cli-init b.vue init webpack myapp //myapp:项目名称 visual code中添加辅助插件: js-css-html formatter html css support debugger for chrome auto close tag vetur 原文地址:https://www.c

vue(2)创建项目

1.创建项目 cmd到自己指定目录下,执行 vue init webpack-simple hello-vue 2.安装项目依赖 cd hello-vue cnpm install 3.运行该项目,测试是否能够正常运行 cnpm run dev 接着,浏览器自动执行了http://localhost:8080/, 原文地址:https://www.cnblogs.com/yaoyuan2/p/10345383.html

redis数据库-VUE创建项目

redis数据库 ''' 关系型数据库: mysql, oracle 非关系型数据库(nosql): redis,mongodb (没有表的概念) key-value mongodb: json 数据--存储在硬盘上 redis: 存在内存中 --- 速度最快 用途: --做缓存 --session数据 --游戏排行榜 --对速度要求高的数据的存储 -- 消息队列 ''' redis VS Memcached -- redis 支持五大数据类型 : 字符串| 列表| 字典 | 集合| 有序集合

vue 2.0创建新项目

参考链接  https://segmentfault.com/a/1190000011275993 背景在安装完node的基础上,机器什么都没安装参考上述链接 一.下载vue $ cnpm install vue 二.全局安装脚手架 $ cnpm install --global vue-cli 三.切换到想要创建项目的目录如我想在F盘下面创建项目 f: 四.在盘符f盘下创建项目my-project,创建完成之后会有一系列的注释需要填写,例如项目名称,作者名等等,嫌麻烦可以用下面第二种simpl

使用 NPM 安装Vue并创建项目

一.下载node.js 官方下载地址:https://nodejs.org/en/download/ 选择相应版本安装 下载完成后一路next安装完成. 一般环境变量会自动添加,打开命令行测试是否安装成功 二.安装cnpm 使用下面命令安装淘宝镜像npm npm install -g cnpm --registry=https://registry.npm.taobao.org 等待安装完成后,使用npm -v命令测试是否安装成功. 三.安装Vue 全局安装Vue CLI 3.X版本 npm i

vue环境搭建及创建项目

安装node环境:node环境下载地址:https://nodejs.org/zh-cn/download/,可根据对应的操作系统版本下载安装 安装完成后查看对应的node和npm版本,如没有出现对应版本号则代表安装失败 安装vue-cli(vue脚手架)安装vue-cli之前确保要先是否安装webpack webpack安装命令:npm install webpack -g 安装好后开始安装 vue-cli npm install -g vue-cli -g代表的是全局安装 vue-cli安装