精华内容
下载资源
问答
  • VUE项目创建过程及本地运行

    千次阅读 2017-04-26 12:01:37
    VUE项目创建过程及本地运行VUE创建过程 1)、安装环境: npm install -g cnpm –registry=https://registry.npm.taobao.org(淘宝镜像) npm install webpack -g npm install vue-cli -g 2)、创建项目:vue init...

    VUE项目创建过程及本地运行

    VUE创建过程

    0)、安装 Node.js

    1)、安装环境:(安装淘宝镜像、webpack、vue-cli)

    npm install -g cnpm --registry=http://registry.npm.taobao.org
    npm install webpack -g
    npm install vue-cli -g

    2)、创建项目:<工程名字不能用中文>

    vue init webpack-simple 工程名字

    3)、安装vue路由模块和网络请求模块:

    npm install vue-router vue-resource --save

    4)、启动项目:(进入项目、安装项目依赖、运行项目)

    cd 工程名字
    npm install
    npm run dev

    VUE运行(VSCode编辑器)
    1). 安装 BrowserSync
    npm install -g browser-sync
    2). 启动 BrowserSync
    静态网站:
    // –files 路径是相对于运行该命令的项目(目录)
    browser-sync start –server –files “css/.css, .html”
    // 如果你的文件层级比较深,您可以考虑使用 **(表示任意目录)匹配,任意目录下任意.css 或 .html文件。
    browser-sync start –server –files “/.css, /.html”

    一般用到的vue插件安装

    安装vue element UI
    npm i element-ui -S
    安装axios
    先安装!
    npm install axios
    然后!
    npm install –save axios vue-axios
    安装less
    1.npm install less less-loader –save-dev
    2、在style中声明lang=”less”。 注意: scoped的作用仅仅是限定css的作用域,防止变量污染。
    3、这样就可以根据less的语法使用了。
    安装vue-scroller
    npm install vue-scroller -D
    安装vux

    npm install vux –save

    具体查看https://doc.vux.li/zh-CN/install/npm.html

    展开全文
  • vue项目创建新的页面

    万次阅读 2019-06-30 02:41:38
    1.项目脚手架地址:https://github.com/vuejs/vue-cli![ 2.项目结构 module下的目录 以上为项目结构. 创建一个县的页面步骤 测试效果 Element-UI库 一些组件直接用Element-UI Element-UI官方站点:...

    1.项目脚手架地址:https://github.com/vuejs/vue-cli![
    2.项目结构
    在这里插入图片描述

    在这里插入图片描述
    module下的目录

    在这里插入图片描述

    在这里插入图片描述

    以上为项目结构.

    创建一个县的页面步骤

    在这里插入图片描述

    测试效果
    在这里插入图片描述
    Element-UI库
    一些组件直接用Element-UI

    Element-UI官方站点:http://element.eleme.io/#/zh-CN/component/installation

    展开全文
  • vue环境搭建,vue项目创建

    万次阅读 多人点赞 2017-02-24 11:36:12
    vue这个新的工具,确实能够提高效率,在经历的一段时间的摧残之后,终于能够有一个系统的认识了,下面就今天的收获做一个总结,也是vue入门的精髓: 1.要使用vue来开发前端框架,首先要有环境,这个环境要借助于...

    vue这个新的工具,确实能够提高效率,在经历的一段时间的摧残之后,终于能够有一个系统的认识了,下面就今天的收获做一个总结,也是vue入门的精髓:
    1.要使用vue来开发前端框架,首先要有环境,这个环境要借助于node,所以要先安装node,借助于node里面的npm来安装需要的依赖等等。
    这里有一个小技巧:如果在cmd中直接使用npm来安装的一些工具的话会比较慢,所以我们使用淘宝的npm镜像:
    输入npm install -g cnpm –registry=https://registry.npm.taobao.org,即可安装npm镜像,以后再用到npm的地方直接用cnpm来代替就好了
    安装完npm镜像后,开始安装全局vue-cli脚手架,之所以要用vue-cli,是应为这个工具能帮我们搭建好我们需要的模板框架,比较简单。方法:cnpm install -g vue-cli 回车,验证是否安装成功,在命令行中输入vue,出来vue的信息说明安装成功
    这里写图片描述

     2.安装完脚手架以后开始,开始创建一个新项目:命令 vue init webpack vue_project(最后这个是我创建的项目文件夹的名字)
    

    这里写图片描述

    至此,一个新的项目文件夹就创建完成,这个项目文件是在使用了脚手架vue-cli的前提下创建的,所以使用了这个工具提供的默认版式,
    这里写图片描述

    这就是使用脚手架搭建的项目文件的结构

    3.因为各个模板间都是相互依赖的,所以要安装依赖,用命令进入项目后cd my_project,在命令行输入cnpm install ,你会发现在已经创建的项目结构里面会多出一个node_modules的文件夹,里面就是刚才安装的所有依赖。

    4.准备工作做好以后,测试一下项目里面默认的app.vue模块能否跑起来,这是需要先安装一下服务器环境,在命令行中输入
    cnpm run dev 回车即可
    这里写图片描述

    8080就是默认的端口,在浏览器地址栏中输入localhost:8080会发现默认的模块打开了!

    注:如果已经全局安装过vue-cli了,再搭建项目的时候无需再安装一遍,直接使用vue init webpack 项目名 即可

    展开全文
  • Vue入门(二)—— vue项目创建

    千次阅读 2020-02-28 20:06:32
    进入配置页 选择 Linter/Formatter 的配置为 standard 标准的配置,如图 其他配置保持不变,点击创建项目 此时会弹出一个界面问你是否保存为预设,你可以自行选择。 选择完成后,稍等一下项目创建好了,此时会...

    本文章默认您已经搭建好了vue-cli脚手架,如果您还没有搭建好,可以访问上一篇文章Vue入门(一)—— vue-cli脚手架安装

    1.打开vue图形界面

    执行命令

    vue ui
    

    此时浏览器会弹出图形界面工具

    2.创建项目

    在这里插入图片描述
    点击页面下方的创建新项目
    在这里插入图片描述
    在详情页下完成两个操作:
    1.输入项目名称
    2.填写一个git初始化提交信息(此步可省)
    其他的选项保持默认即可,点击下一步
    在这里插入图片描述
    进入预设页
    其中my_preset为用户的自定义预设(配置完成后可保存为预设,下次不用再配置)
    有预设的话到此步就选择你的预设即可创建完成。
    没有预设的话点击“手动”创建,然后点击下一步。

    进入功能页,此处暂且选择5个功能:
    1.Babel(必选)
    2.Router(必选)
    3.Vuex(小项目没必要,大项目选)
    4.Linter/Formatter(必选)
    5.使用配置文件(推荐)
    点击下一步。

    进入配置页
    选择 Linter/Formatter 的配置为 standard 标准的配置,如图

    在这里插入图片描述
    其他配置保持不变,点击创建项目

    此时会弹出一个界面问你是否保存为预设,你可以自行选择。

    选择完成后,稍等一下项目就创建好了,此时会显示仪表盘界面。
    你可继续添加依赖或插件,也可以通过任务页来启动项目。
    下篇文章会具体讲项目的初始化配置。

    展开全文
  • vue项目创建及利用axios跨域

    千次阅读 2018-03-28 17:06:25
    由于有另外一篇很详细的博客 所以这篇就挑选主要和精华的操作记录 方便那些想快速学习的人看 ...2.vue init webpack myvue 创建webpack版本的项目 然后根据需求选择 我这里vue-router选择的y 后面的验证...
  • 基于webstorm2019的Vue项目创建步骤

    千次阅读 2019-06-30 17:14:48
    2、在webstorm中选择Vue项目开发; 注:在此之前需要安装和配置Vue的相关环境: a)安装Node.js(http://nodejs.cn/); 在终端执行:node -v 看是安装成功; b)分别使用命令安装: 1)淘宝镜像:npm install -g cnpm ...
  • Vs2017 Vue项目创建

    千次阅读 2018-11-14 21:04:00
    1.创建vue project 项目。 2.找到项目目录,使用管理员打开cmd . 3.进入该目录,先使用“npm install -g typescript” 安装typescript. 4.安装成功后输入“tsc -v”测试是否安装成功。 5.使用“npm ...
  • ![图片说明]... 如图,是我在安装配置的时候漏了什么吗? ...新建项目的方式如图 ![图片说明](https://img-ask.csdn.net/upload/201912/17/1576596143_664445.png)
  • 项目创建报错: This dependency was not found: * !!vue-style-loader!css-loader?{"minimize":false,"sourceMap":false}!../../node_modules/vue-loader/lib/style-compiler/index?{"vue":true,"id":"data-v...
  • 创建一个vue项目启动时报错,报错的内容为: error in ./src/App.vue Module build failed: Error: No parser and no file path given, couldn’t infer a p arser. at UndefinedParserError.Wrapper (D:\...
  • vue — 创建vue项目

    千次阅读 2018-10-18 14:19:25
    创建vue项目 在程序开发中,有三种方式创建vue项目,本地引入vuejs、使用cdn引入vuejs、使用vue-cli创建vue项目。其中vue-cli可以结合webpack打包工具使用,大大方便了开发步骤,使用广泛。 vue本地引用 在官网...
  • 新手,我通过Vue脚手架创建Vue项目(可视化界面上创建)的时候,每次到最后一步创建项目的时候都会卡在一个地方,请大佬们点拨点拨 ![图片说明](https://img-ask.csdn.net/upload/202002/15/1581754453_778642.jpg) ...
  • 用vue ui创建新的vue项目

    千次阅读 2019-11-24 19:17:44
    用vue ui创建新的vue项目 vue3.0以上才会有vue ui功能 一、创建vue项目 1.在命令行里面输入vue ui 2.进入创建新项目页面 输入项目名称,填写git初始化提交信息,下一步 3.预设面板 可以选择以前创建过的预设...
  • 创建VUE项目,2.0版本和3.0版本的区别使用vue2.0版本创建vue项目创建前的准备开始创建创建过程项目正常创建使用vue3.0版本创建vue项目 使用vue2.0版本创建vue项目 你好! 这是你第一次使用 Markdown编辑器 所展示的...
  • Idea创建Vue项目流程

    千次阅读 2019-10-25 15:41:43
    Vue项目创建流程 完全没有接触过vue的小白,之前还学过js,但是由于这近两年的时候一直在接触后台,前台已经忘的差不多了,想拾起来,学习学习。 用idea完全不知道怎么创建前台项目,然后问了我们项目的前台大哥,...
  • vue 项目安装 安装官网:vue 终端安装 环境要求: 安装有 Node.js、 vuevue-cli 。 查看nodejs版本和npm版本,在命令行中输入: node -v npm -v npm更新到最新的版本 npm install -g npm 淘宝 NPM 镜像,大家都...
  • 如何使用vue-cli创建vue项目

    万次阅读 2021-02-07 11:19:36
    如何使用vue-cli创建vue项目 首先在指定的目录使用vue create 项目名创建项目 然后进行选择 根据需要选择不同的创建方法,我选择第三个 然后接着下一步 选择完后按enter键 然后再...
  • Vue项目启动原理及项目的创建

    万次阅读 多人点赞 2018-06-08 13:29:40
    首先看下图:一般一个初步的Vue项目创建好之后都会有这三个文件:index.html 、main.js 、App.js;1、index.html :众做周知,Vue是单页面形式开发,而这个index.html文件在其中起着特别重要的作用。所有组件(后缀名...
  • Vue UI 创建Vue前端工程(Windows)

    万次阅读 多人点赞 2020-09-27 15:56:40
    Vue ui 创建Vue前端工程1.开启vue ui 服务2.访问 vue ui 界面3.创建项目4. 添加 element-ui 插件4.添加依赖4.启动 Vue 项目5.访问 Vue 项目 1.开启vue ui 服务 快捷键 win+r 打开 cmd 输入下面命令 vue ui 2.访问 ...
  • ubuntu创建vue项目

    千次阅读 2018-07-23 21:29:54
    一、创建vue项目 创建一个文件夹(test是我自己的文件夹) mkdir test   进入文件夹 cd test   安装和下载全局vue-cli(因为我之前安装好了,所以不需要再次安装)(此...
  • vue脚手架创建项目

    千次阅读 2019-12-08 11:24:55
    vue-cli 是一个官方发布 vue.js 项目脚手架,使用 vue-cli 可以快速创建 vue 项目以及更改对相应的webpack配置 安装vue 全局安装 npm install vue -g 局部安装 npm install vue 我这里采用的是全局安装 安装vue-...
  • 创建VUE项目(2.9.6)

    千次阅读 2019-07-11 23:57:11
    创建VUE项目 环境安装 git node.js vue vue-cli 环境安装这块下次在好好详细深究下吧,今天好好看下怎么样创建一个VUE项目 创建项目 1.执行创建项目命令 在要创建项目的目录下执行指令,test是要创建项目的项目名 ...
  • cnpm安装vue及创建vue项目

    千次阅读 2019-08-07 17:55:44
    本人小白第一次写博客,...一开始我用npm来安装vue的脚手架工具(官方命令行工具),没有安装成功。 使用cnpm来安装,很快就装好了。 打开cmd窗口输入npm install -g cnpm --registry=https://registry.npm.taobao.o...
  • vue3创建项目

    万次阅读 2020-04-28 11:12:14
    vue3创建项目 vue create 项目名称 //回车 default默认配置,manually手动配置,如果选择默认一直回车即可,选择手动需要进行相应的配置如下图 根据自己项目需求选择相应的选项,空格选择,a全选 babel---...
  • 使用Vue-CLI创建Vue项目

    千次阅读 多人点赞 2020-04-21 21:45:33
    利用Vue-CLI初始化构建Vue项目时,我们将会获得一个初始的文件夹结构,如下所示: 2 . 安装Vue-CLI npm install -g @vue/cli 或 yarn global add @vue/cli 例: 3 . 使用vue --version或vue -V指令,查...
  • 使用 vue-lic3 创建 vue 项目

    千次阅读 2018-12-14 16:28:44
    使用 vue-lic3 创建 vue 项目 在使用 vue-lic3 创建 vue 项目工程之前首先要确保已经安装了 nodejs,webpack vue-cli 是 vue 的脚手架,可以用配置好的模版快速搭建起一个项目工程,不用自己去配置 webpack 配置...
  • Vue创建项目步骤

    万次阅读 多人点赞 2019-09-23 10:24:30
    Vue框架使用vue简介MVVM的介绍vue项目步骤vue项目目录详解运行vue可以自动打开浏览器如何使用less写样式 vue简介 Vue 是一套用于构建用户界面的渐进式框架。与其它大型框架不同的是,Vue 被设计为可以自底向上逐层...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 125,950
精华内容 50,380
关键字:

vue项目创建

vue 订阅