admin 管理员组

文章数量: 1184232

1、安装

1. 必安插件(⽂件夹)下的 ==google-access-helper-2.3.0(⽂件夹)== 复制到你想放的⽂件夹下(==安装后不可以挪动 位置==) 建议D盘下, 弄⼀个专门按软件的⽂件夹 2. 打开⾕歌浏览器-扩展程序-开发者模式打开-把⽂件夹拖进来就安装完毕 功能如下: ⾕歌浏览器上 同步书签(需要注册和登录, 开启同步功能) - 可以暂不使⽤(因为有的⼿机号可能注册不了⾕歌账号)⾕歌商店(⽆需登录, 安装其他插件) 学习, 调试vue必备之利器 - 官⽅提供的呦 右上⾓-插件-⾕歌访问助⼿-打开Chrome商店-搜索vue-devtools回车-然后添加⾄Chrome等待下载后⾃动安装-右上 ⾓显⽰已经添加即代表成功 如果实在打不开⾕歌商店, 换个⽹ / 直接⽤备⽤⽂件夹⾥的vue-devtools插件包安装到浏览器扩展程序也⼀样⽤ ==不要图标上带橘黄⾊beta== ==如果这个⽹址打不开, 就⽤预习资料⾥备⽤的本地版安装也可以, 安装过程和上个插件安装过程⼀致
vscode-插件补充
vue⽂件代码⾼亮插件-vscode中安装 代码提⽰插件-vscode中安装

2.@vue/cli安装

⽬标: @vue/cli模块包按到全局, 电脑拥有vue命令, 才能创建脚⼿架⼯程
全局安装命令

yarn global add @vue/cli # OR npm install -g @vue/cli 注意: 如果半天没动静(95%都是⽹速问题), 可以ctrl c 1. 停⽌重新来 2. 换⼀个⽹继续重来
查看vue脚⼿架版本
vue -V 总结: 如果出现版本号就安装成功, 否则失败

3、@vue/cli 创建项⽬启动服务

⽬标: 使⽤vue命令, 创建脚⼿架项⽬ ==注意: 项⽬名不能带⼤写字母, 中⽂和特殊符号==
 (1)创建项⽬
# vuecreate是命令, vuecli-demo是⽂件夹名 vue create vuecli-demo
(2)选择模板
==可以上下箭头选择, 弄错了ctrl+c重来==
(3)回车等待⽣成项⽬⽂件夹+⽂件+下载必须的第三⽅包们

(4)进⼊脚⼿架项⽬下, 启动内置的热更新本地服务器
cd vuecil-demo npm run serve # yarn serve 只要看到绿⾊的 - . 你成功了(底层node+webpack热更新服务) 打开浏览器输⼊上述地址 总结: vue命令创建⼯程⽬录, 项⽬内置webpack本地热更新服务器, 帮我们打包项⽬预览项⽬

4、重点文件夹的意思

主要⽂件及含义
node_modules下都是下载的第三⽅包 public/index.html – 浏览器运⾏的⽹⻚ src/main.js – webpack打包的⼊⼝⽂件 src/App.vue – vue项⽬⼊⼝⻚⾯ package.json – 依赖包列表⽂件

本文标签: Vue