vue 使用vueCli 搭建vue2.x开发环境,并且指定ts 和less

nodejs 安装过程省略

设置淘宝镜像 永久使用

E:\front-workspace>npm config set registry https://registry.npmmirror.com

使用 npm 安装 cnpm(使用淘宝镜像)

npm install -g cnpm --registry=https://registry.npmmirror.com

或者使用官方淘宝镜像(两者都可以)

npm install -g cnpm --registry=https://registry.npm.taobao.org

安装VUE脚手架

E:\front-workspace>npm install -g @vue/cli

安装yarn 包管理器

E:\front-workspace>npm install -g yarn

added 1 package in 3s

查看客户端脚手架的版本

E:\front-workspace>vue --version

@vue/cli 5.0.9

创建 Vue 2.x 项目

使用 vue create 命令创建项目

vue create vue2-emall-web

在交互式界面中,您可以选择:

选择预设:

Default (Vue 2 babel, eslint)

Default (Vue 3 Preview) (Vue 3 babel, eslint)

Manually select features (手动选择功能)

如果选择手动选择,会出现以下选项:

? Check the features needed for your project:

?Choose Vue version

?Babel

?TypeScript

?Progressive Web App (PWA) Support

?Router

?Vuex

?CSS Pre-processors

?Linter / Formatter

?Unit Testing

?E2E Testing

使用键盘上最长的空格键 选择需要的某块

Vue CLI v5.0.9

? Please pick a preset: Manually select features

? Check the features needed for your project: Babel, TS, Router, Vuex, CSS Pre-processors, Linter

? Choose a version of Vue.js that you want to start the project with 2.x

? Use class-style component syntax? Yes

? Use Babel alongside TypeScript (required for modern mode, auto-detected polyfills, transpiling JSX)? Yes

? Use history mode for router? (Requires proper server setup for index fallback in production) Yes

? Pick a CSS pre-processor (PostCSS, Autoprefixer and CSS Modules are supported by default): Less

? Pick a linter / formatter config: Standard

? Pick additional lint features: Lint on save

? Where do you prefer placing config for Babel, ESLint, etc.? In dedicated config files

? Save this as a preset for future projects? Yes

? Save preset as: vue2-emall-web

最后回车之后等待项目初始化完成

? Successfully created project vue2-emall-web.

? Get started with the following commands:

$ cd vue2-emall-web

$ npm run serve

使用 HBuilder x 开发工具打开项目文件夹加载项目之后

在客户终端命令行输入

npm run serve

显示如下内容说明启用成功

Note that the development build is not optimized.

To create a production build, run npm run build.

http://localhost:8080/ 浏览器访问 出现 VUE Welcome to Your Vue.js + TypeScript App 说明前段安装成功

相关推荐
道友可好26 分钟前
用 Linter 驾驭 AI:机械化执行的艺术
前端·人工智能·后端
流浪码农~31 分钟前
Element Plus DatePicker 动态设置每周起始日
前端·vue.js·elementui
jason_yang34 分钟前
刚发版就背锅?前端版本控制就靠他version-rocket
前端
如果超人不会飞37 分钟前
TinyVue NavMenu导航菜单组件使用指南
前端·vue.js
Jason_chen39 分钟前
Linux 3.0 串口机制深度解析:传统8250驱动与基础RS-232/485支持
linux·前端
TPBoreas42 分钟前
前端面试问题打靶
前端
赵庆明老师43 分钟前
JS检查提交的文件是否合规
开发语言·前端·javascript
禅思院1 小时前
前端请求取消与调度完全指南:从 AbortController 到企业级优先级架构
前端·设计模式·前端框架
颂love1 小时前
Vue的两大生态以及组件通信
前端·javascript·vue.js·typescript
甜汤圆1 小时前
Python 里**自定义数据单元**
前端