Vue学习（二） ：第一个Vue项目
2024-10-21 05:00:44
OS: Windows 10 Home 64bit
Chocolatey version: 0.10.13
npm version: 6.4.1
yarn version: 1.16.0
git version: 2.21.0.windows.1
1. 安装Chocolatey
管理员权限打开PowerShell，Copy-Paste-Enter以下文本。
@"%SystemRoot%\System32\WindowsPowerShell\v1.0\powershell.exe" -NoProfile -InputFormat None -ExecutionPolicy Bypass -Command "iex ((New-Object System.Net.WebClient).DownloadString('https://chocolatey.org/install.ps1'))" && SET "PATH=%PATH%;%ALLUSERSPROFILE%\chocolatey\bin"
2. 安装nodejs&npm&cnpm|yarn
# full install with npm
cinst nodejs.install
# install cnpm - npm's taobao version
npm install -g cnpm --registry=https://registry.npm.taobao.org
# install yarn(a better dependency manage tool compared to npm)
cinst yarn
3. 安装git
下载地址: https://git-scm.com/downloads
4. vuejs开发环境搭建
# 安装脚手架Vue CLI 2.9.6
npm i -g vue-cli
# 升级到Vue CLI 3
npm uninstall -g vue-cli
npm install -g @vue/cli
5. 创建第一个项目
Vue CLI 2.9.6
# 准备一个存放项目的工作区
>cd /d D:
>md gs-workspace
>cd gs-workspace
# 创建一个基于webpack模板的项目(需要git、npm支持)
>vue init webpack gs-project
? Project name gs-project
? Project description A Vue.js project
? Author shuvidora <2245862630@qq.com>
? Vue build standalone # ↑↓选第1项
? Install vue-router? Yes # 路由插件
? Use ESLint to lint your code? Yes # 代码检查工具
? Pick an ESLint preset Standard # ↑↓选第1项
? Set up unit tests No # 单元测试
? Setup e2e tests with Nightwatch? No # 测试框架
? Should we run `npm install` for you after the project has been created? (recommended) npm # ↑↓选第1项npm或第2项yarn安装依赖或者第3项稍后安装
# 构建成功消息！
vue-cli · Generated "gs-project".
Vue CLI 3
vue create gs-project
6. 在浏览器运行Vue项目
>cd gs-project
>cnpm run dev
# 运行成功消息！
DONE Compiled successfully in 4279ms 10:43:26
I Your application is running here: http://localhost:8080
浏览器访问http://localhost:8080
同一个项目多次run端口号不变，不同项目端口号存在差异
最新文章
- window下的各种宽高度小结
- 2016福州大学软件工程 团队Git Review
- Objective-C 快速入门--基础(五)
- macbook 快捷键
- FlipView For Xamarin.Form 之 IOS
- unix/linux进程详解
- iOS开发 爱特开发技术bug总结
- 【quartz】 理论知识
- 在sql语句中使用plsql变量
- 实例：SSh结合Easyui实现Datagrid的分页显示
- C++—引用的作用
- 对 dotweb 框架进行统一的自定义错误处理
- whil
- 3.0+百度地图在地图初始化的时候就弹框展示一个信息框，而不是用户点击poi时才弹出
- 算法总结（转自CS-Notes）
- java学习-加载.properties工具类
- TiDB数据库 mydumper与loader导入数据
- android 读取 raw 中的文件。
- WebService系列二：使用JDK和CXF框架开发WebService
- Mysql数据库一:安装与创建windows服务