vue2.0搭建环境

小鱼儿 2022-06-02 07:26 186阅读 0赞

## **1、安装 node.js ** ##

## 从官网上下载 https://nodejs.org/en/ 装上 ##

2、全局安装 webpack

npm install webpack -g

3、全局安装 vue

npm install vue-cli -g

4、进入项目路径，创建项目 ,里面要填写一些基本信息

vue init webpack-simple 项目名xxx

5、cd 进入项目目录，安装项目依赖

npm install

6、安装路由模块

npm install vue-router --save

7、安装网络请求模块

npm install axios --save

## 8、启动项目 ##

npm run dev

正常情况下浏览器会自动打开 http://localhost:8080/ 项目

9、打开项目 main.js 把路由和网络请求添加进项目，然后添加两个组件 First 和 secondcomponent

import Vue from 'vue'
    import App from './App.vue'
    import VueRouter from "vue-router";
    import VueResource from 'vue-resource'
    
    Vue.config.debug = true;
    
    Vue.use(VueRouter);
    Vue.use(VueResource);
    
    const First = { template: '<div><h2>我是第 1 个子页面</h2></div>' }
    import secondcomponent from './secondcomponent.vue'
    
    const router = new VueRouter({

mode: 'history', // 不加这个是路径是 # 号模式，如 http://localhost:8080/#/home  加上这个是http://localhost:8080/api
      base: __dirname,
      routes: [
      
        {
          path: '/first',
          component: First
        },
        {
          path: '/second',
          component: secondcomponent
        }
      ]
    })
    
    const app = new Vue({
      router: router,
      render: h => h(App)
    }).$mount('#app')

发表评论取消回复

表情：

评论列表（有 0 条评论，186人围观）

还没有评论，来说两句吧...

相关阅读

相关 Vue 环境搭建

vue 环境配置文章目录 * * vue 环境配置 * * 1 node.js * 2 安装淘宝镜像（类似于阿里云...

分手后的思念是犯贱/ 2024年04月18日 21:14/ 0 赞/ 77 阅读

相关搭建vue环境

安装node后配置一、同时按住键盘的win+R 打开运行窗口输入cmd进入cmd页面二、输入cmd命令 > 1.将npm设置为淘宝镜像： > npm confi

喜欢ヅ旅行/ 2023年10月04日 21:15/ 0 赞/ 45 阅读

相关 vue环境搭建

vue环境搭建安装node：判断有没有装node npm包管理器，集成在node中（不用安

绝地灬酷狼/ 2022年12月11日 12:19/ 0 赞/ 247 阅读

相关 Vue环境搭建

关于vue安装的步骤总结 1. 安装node.js [点击去下载][Link 1]（直接安装即可，无注意事项） 2. 打开cmd（Windows+R），检测node是

小鱼儿/ 2022年12月02日 12:27/ 0 赞/ 216 阅读

相关 Vue开发环境搭建

Vue开发环境搭建 1、下载并安装nodejs [https://nodejs.org/][https_nodejs.org] 2、检查版本 node

小咪咪/ 2022年08月31日 06:50/ 0 赞/ 343 阅读

相关 vue环境搭建

（1）简洁（2）轻量（3）快速（4）数据驱动（5）模块友好（6）组件化 Vue特点简洁： HTML 模板 + JSON 数据

今天药忘吃喽~/ 2022年06月13日 06:26/ 0 赞/ 227 阅读

相关 vue开发环境搭建

前言: 作为一个后端程序员,但是又想搭建网站.不依靠别人,那只得自己学点前端. 除了常用的bootstrap之外还想学一样,物色几样如 easyUI , angular

淡淡的烟草味﹌/ 2022年04月11日 14:25/ 0 赞/ 364 阅读

相关 VUE环境搭建步骤

1. 下载node.js 放在：D:\\nodejs\\node-v10.3.0-win-x64 计算机右键–>属性—>高级环境变量—》系统变量pa

柔光的暖阳◎/ 2022年02月26日 01:12/ 0 赞/ 346 阅读

相关 nodejs搭建vue环境

首先下载node.js安装并且配置好环境变量。去nodejs官网下载即可，地址：http://nodejs.cn/中文网前提要安装以下： 1）安装npm淘宝

我不是女神ヾ/ 2022年02月03日 09:19/ 0 赞/ 342 阅读

相关 Vue 环境搭建

1. 命令行安装前提：安装node 在node命令行中输入，全局安装 vue-cli npm install --global vue-cli 2. 创建Vue工

以你之姓@/ 2022年02月01日 01:41/ 0 赞/ 306 阅读