vue项目开发(一) 利用vue-cli+webpack构建一个vue项目

作者:神秘网友 发布时间:2020-08-12 17:28:51

vue项目开发(一) 利用vue-cli+webpack构建一个vue项目

vue项目开发(一) 利用vue-cli+webpack构建一个vue项目

    到现在已经用Vue写了几个项目了,对Vue也算是比较熟悉了,对于Vue基本语法这里不做过多的介绍,具体语法可通过官网进行学习,现在主要来分享一下自己是如何利用Vue开发一个项目的。

    要进行Vue开发,我们首先要搭建起一个Vue项目的框架,在这里我用到的是Vue-cli+Webpack的方式进行的项目框架的搭建,主要分为以下几个步骤。

    (1)全局安装Vue脚手架Vue-cli.

          命令: npm install -g vue-cli

vue项目开发(一) 利用vue-cli+webpack构建一个vue项目vue项目开发(一) 利用vue-cli+webpack构建一个vue项目

    (2)利用webpack创建一个属于自己的项目文件夹。

  命令:vue init webpack vue_demo

vue项目开发(一) 利用vue-cli+webpack构建一个vue项目vue项目开发(一) 利用vue-cli+webpack构建一个vue项目

    (3)进入上面创建的项目文件夹并安装项目所需要的依赖包。

         命令:cd   vue_demo             /*进入项目*/

                      npm install                   /*安装依赖包*/

vue项目开发(一) 利用vue-cli+webpack构建一个vue项目vue项目开发(一) 利用vue-cli+webpack构建一个vue项目

    (4)运行项目。

          命令:npm run dev

vue项目开发(一) 利用vue-cli+webpack构建一个vue项目vue项目开发(一) 利用vue-cli+webpack构建一个vue项目vue项目开发(一) 利用vue-cli+webpack构建一个vue项目

    如果你看到这个页面,那恭喜你,一个简单的vue项目就搭建成功了。

vue项目开发(一) 利用vue-cli+webpack构建一个vue项目

    如果遇到什么问题,欢迎留言一起探讨。

    

vue项目开发(一) 利用vue-cli+webpack构建一个vue项目相关教程

  1. JQuery利用find查找子元素并修改其样式和属性
  2. Vuex简单总结
  3. 利用在线教育直播源码搭建系统时有哪些搭建要点需要注意
  4. vue.js基础(5)
  5. 利用ArrayList对map进行按key(键)和按value (值) 排序
  6. java 利用 screw插件 生成数据库文档
  7. vue3.0新特性初体验(一)
  8. 利用easyui实现增删改查:easyui样式的日期的显示