VScode使用与利用vue-cli脚手架新建一个vue项目

x33g5p2x  于2021-10-09 转载在 Vue.js  
字(0.6k)|赞(0)|评价(0)|浏览(188)

Vscode打开终端

ctrl+~

安装vue-cli

全局安装vue-cli
npm install -g vue-cli

安装webpack

它是打包js的工具
npm install -g webpack
npm install webpack-cli -g

创建新vue项目

vue init webpack 你的项目名

运行项目

npm run dev

注意:要进入项目下,即,必须有package.json的目录

访问http://localhost:8080/

如上则表示创建vue项目成功

打包

npm run build

运行某个页面

如果你不想在本地运行,而是想在浏览器运行
这时候你需要安装一个扩展插件

然后回到页面,鼠标右键,你就能看到open in default browser
当然你也可以选择other

在浏览器上运行

如果你想在localhost:8080/xxx/xxx.html这样的路径上访问页面
那么你需要配置路由

快速新建一个html页面

首先添加一个文件,然后在空白页上输入英文状态的!然后按tab键,就能看到自动创建的html页面如下

一些常用的插件

vue-axios通信

npm install --save axios vue-axios

import Vue from 'vue'
import axios from 'axios'
import VueAxios from 'vue-axios'

Vue.use(VueAxios, axios)

相关文章