vue.js npm安装方式

Vue.js 提供一个官方命令行工具，可用于快速搭建大型单页应用。

1.Seup node.js

2. npm install -g cnpm --registry=https://registry.npm.taobao.org

3. cnpm sync connect

4.cnpm install vue

5.cnpm install -g vue-cli

6.vue -V

7. vue init webpack my-project

先列出我们接下来需要的东西：

• node.js环境（npm包管理器）
• vue-cli 脚手架构建工具
• cnpm npm的淘宝镜像      

  1） 安装node.js

    解释器安装(windows)：
      1、下载：到官网下载https://nodejs.org/en/download/
      2、安装和普通的软件一样安装，主要就是一个安装目录的问题而已，随便选择目录。
      3、检查系统的path环境变量中是否配置了node.exe的目录路径：

       请参考：https://www.cnblogs.com/zhouyu2017/p/6485265.html

IDE是WebStorm，界面跟pycharm相似。

（2）安装cnpm

在命令行中输入  npm install -g cnpm --registry=http://registry.npm.taobao.org  ，没报错表示安装成功，

 3） 安装vue-cli 脚手架构建工具

           在命令行中运行命令 npm install -g vue-cli ，然后等待安装完成。

           是否安装成功：vue -V          

 

# 全局安装 vue-cli
$ cnpm install --global vue-cli

# 创建一个基于 webpack 模板的新项目
$ vue init webpack my-project
# 这里需要进行一些配置，默认回车即可

 cd  项目名；进入项目中

    安装项目package.json所需要的依赖：执行 cnpm install   (npm可能会有警告，这里可以用cnpm代替npm了，运行别人的代码需要先安装依赖)

介绍一下目录及其作用：

     build：最终发布的代码的存放位置。

     config：配置路径、端口号等一些信息，我们刚开始学习的时候选择默认配置。

     node_modules：npm 加载的项目依赖模块。

     src：这里是我们开发的主要目录，基本上要做的事情都在这个目录里面，里面包含了几个目录及文件：

             assets:放置一些图片，如logo等

             components:目录里放的是一个组件文件，可以不用。

             App.vue：项目入口文件，我们也可以将组件写这里，而不使用components目录。

            main.js ：项目的核心文件

     static：静态资源目录，如图片、字体等。

     test：初始测试目录，可删除

      .XXXX文件：配置文件。

     index.html：首页入口文件，可以添加一些meta信息或者同统计代码啥的。

     package.json：项目配置文件。

     README.md：项目的说明文件。

      这就是整个项目的目录结构，其中，我们主要在src目录中做修改。这个项目现在还只是一个结构框架，整个项目需要的依赖资源都还没有安装。    安装项目所需要的依赖：执行 cnpm install   (这里可以用cnpm代替npm了)

运行项目

    在项目目录中，运行命令 npm run dev ，会用热加载的方式运行我们的应用，热加载可以让我们在修改完代码后不用手动刷新浏览器就能实时看到修改后的效果。

https://blog.csdn.net/m0_37479246/article/details/78836686