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 说明前段安装成功

相关推荐
小码哥_常2 小时前
一套自己部署的 IM,客户端是同一份 Flutter
前端·后端
蜗牛攻城狮5 小时前
微前端四大方案选型对比与最佳实践:qiankun、micro-app、wujie、Module Federation
前端·微前端·qiankun·前端架构·micro-app·wujie
她说可以呀6 小时前
Vue插槽
前端·javascript·vue.js
qq_448011166 小时前
Vue + Jinja2两套模版与法冲突造成undefinedError
前端·javascript·vue.js
aixingpan7 小时前
aixingpan.cn API开发文档:前端查询夏令时和时区接口指南
前端·php
2601_958352907 小时前
23.5×19mm 换掉一整条音频链?|A-68 集成了什么:ADC / DAC / 24.576MHz 时钟 / AEC / 波束降噪,主控仅需 6 根线
前端·音视频·ai降噪·回声消除·语音模块
志尊宝8 小时前
AI原生前端开发(039):AI辅助的Nuxt 4全栈开发
前端·vue.js·ai-native
FRing039 小时前
JavaScript入门到精通三十二(深拷贝、浅拷贝、递归函数)
开发语言·前端·javascript
excel9 小时前
双 Token 与前端使用 Crypto 公私钥鉴权换 Token,哪种方案更好?
前端·后端
外收内放9 小时前
Python基础语法练习题(73)
java·前端·python