美文网首页我爱编程
Vue学习(1)-环境搭建

Vue学习(1)-环境搭建

作者: 小焲 | 来源:发表于2018-04-18 10:45 被阅读0次

环境准备

node.js+npm是必备的开发环境。为了方便命令行的输入,可以选择下载Git客户端。
安装好node.js后,在终端下输入node -v,出现版本号说明安装成功;输入npm -v,出现版本号,说明npm也同时安装成功。

Vue-cli构建项目

vue-cli是 vue的脚手架,可安装vue全家桶。
1.首先安装vue-cli,指令如下:

$ npm install -g vue-cli

2.选择文件存放位置。例如我准备放在~/Vue/下,那么命令如下

$ cd ~/Vue

3.新建自己的项目

$ vue init webpack project-name

之后会出现一些提示,按需选择即可,也可一路回车。
3.安装依赖,启动项目

$ cd project-name
$ npm install
$ npm run dev

思考

1.什么是nodejs? nodejs有哪些用处?

1、nodejs:node是一个平台,是服务器端JavaScript的解析器,nodejs本身运行Google V8 JavaScript引擎,所以速度和性能非常好  
2、nodejs旨在解决创建高性能的网络应用程序,可以编写每秒处理上万条同时访问物理机器的连接代码,并且可处理高并发和异步I/O

Nodejs是什么,有什么用?
2.什么是npm? npm如何安装软件?

1.NPM(node package manager),通常称为node包管理器。顾名思义,它的主要功能就是管理node包,包括:安装、卸载、更新、查看、搜索、发布等。
2.node包的安装分两种:本地安装、全局安装。两者的区别如下:
本地安装(npm install pkg):package会被下载到当前所在目录,也只能在当前目录下使用。
全局安装(npm install -g pkg):package会被下载到到特定的系统目录下,安装的package能够在所有目录下使用。

NPM小结
3.什么是webpack? 它有什么优缺点?

1.WebPack可以看做是模块打包机:它做的事情是,分析你的项目结构,找到JavaScript模块以及其它的一些浏览器不能直接运行的拓展语言(Scss,TypeScript等),并将其打包为合适的格式以供浏览器使用。
2.优点:模块化

什么是WebPack,为什么要使用它?
4.终端的基本使用方法
Ubuntu 终端命令的使用(初学者入门)

参考:Vue2+VueRouter2+webpack 构建项目实战(一)准备工作

相关文章

  • Vue学习(1)-环境搭建

    环境准备 node.js+npm是必备的开发环境。为了方便命令行的输入,可以选择下载Git客户端。安装好node....

  • vue学习(1)-环境搭建

    安装brew,不知道是不是mac专属。输入 /usr/bin/ruby -e "$(curl -fsSL http...

  • vue-cli单页面应用

    vue-cli是vue搭建环境脚手架,只需要几个命令就可以搭建开发环境。 vue-cli脚手架搭建 1.安装nod...

  • Vue(7)

    一、环境搭建 下面我们需要为后面要做的Vue项目搭建开发环境。 1、基本的运行环境 该项目使用node& vue在...

  • 从零搭建Vue项目

    1,搭建Node环境(此处就省略了,可自行百度)2,搭建Vue项目环境全局安装vue-cli(Vue脚手架):cn...

  • 前端环境搭建

    前端开发环境的搭建 vue环境搭建(node,vue-cli,vue) https://www.jianshu.c...

  • Vue

    搭建Vue开发环境1.必须要安装node.js2.搭建vue的开发环境,安装vue的脚手架工具 官方命令行工具n...

  • vue2.0 项目搭建

    vue 初步环境搭建 1. cnpm install vue 安装 vue2.0 2. cnpm install...

  • webpack进阶【17】: vue-cli 脚手架环境搭建

    webpack: vue-cli 脚手架环境搭建 一、搭建 vue-cli 脚手架环境 1、在一个新的文件夹下面,...

  • 2021-08-25_vue环境搭建后端学习笔记

    20210825_vue环境搭建后端学习笔记 1概述 1.1目录结构 [图片上传失败...(image-a63e4...

网友评论

    本文标题:Vue学习(1)-环境搭建

    本文链接:https://www.haomeiwen.com/subject/raomkftx.html