zoukankan      html  css  js  c++  java
  • 环境搭建:Vue环境搭建和项目初始化(windows)

    1.    安装node.js

    官网下载安装:https://nodejs.org/en/

    版本查看:node -v 

    注意:node版本最好新一点好,推荐6.0以上。

    2.    npm安装webpack

    a)     命令

    npm install -g webpack //全局安装

    npm install -g webpack-dev-server //安装调试工具

    b)     Webpack安装权限问题

     

    如果出现上图所示错误说明用户权限受限,使用管理员权限打开命令提示符(或node.js 命令提示符)

     

    User用户身份打开node.js命令提示符窗口如下:

     

    管理员身份打开node.js命令提示符窗口如下:

     

    3.    npm安装vue-cli

    c)     命令

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

    4.    创建一个基于 webpack 模板的新项目

    注:Vue.js官方基于提供的开发模板介绍见《Vue开发模板简介

    4.1完全模式项目创建

    创建项目目录D:\vue_project

    在项目目录下执行下列命令

    vue init webpack project-name //默认安装2.0版本

    vue init webpack#1.0 project-name //安装1.0版本

     

    4.2简单模式项目创建

    创建项目目录D:\webpack-simple-demo

    在项目目录下执行下列命令

    vue init webpack-simple project-name //默认安装2.0版本

    5.    项目目录

    5.1完全模式项目目录

     

    5.2简单模式项目目录

    6.    安装项目依赖

    一定要从官方仓库安装,npm 服务器在国外所以这一步安装速度会很慢。

    npm install

    不要从国内镜像cnpm安装(会导致后面缺了很多依赖库)

    cnpm install

    7.    启动项目

    npm run dev

    8.    发布

    npm run build

    a)     vue-simple-webpack

    执行发布命令后,会生成发布时的build.js,并且是经过压缩的。

    b)     vue-webpack

    执行发布命令后,会将所有的静态资源(包括index.html)都生成到dist目录下。也就是说你可以直接拿着dist目录去发布应用,例如在IIS下将dist目录发布为一个网站。

  • 相关阅读:
    math.js:灵活强大的JavaScript数学库
    math.js:灵活强大的JavaScript数学库
    math.js:灵活强大的JavaScript数学库
    前端开发必须要了解的CSS原理
    前端开发必须要了解的CSS原理
    前端开发必须要了解的CSS原理
    GET和POST有什么区别?
    GET和POST有什么区别?
    GET和POST有什么区别?
    ACM2026
  • 原文地址:https://www.cnblogs.com/zs-note/p/7093128.html
Copyright © 2011-2022 走看看