vue-cli 学习记录

安装vue-cli

  npm i vue-cli -g

  安装完毕后 可以运行 vue -V 查看版本号 -V 的V 是大写

创建 vue项目 ,使用 init  初始化一个项目

         vue init <template-name> <project-name>

        <template-name> 是模板名称  一般使用 模板 webpack

       <project-name> 是项目名称

例如

          vue init webpack hwvue

就能创建出 hwvue 的项目文件夹

进入文件夹nodejs的常用方法 npm install

然后 运行dev 环境的命令是 npm run dev 

它会启动一个 express 的server来显示代码

打包 命令 是 npm run build 

将打包出 一个 dist 的文件夹

里面有一个文件 index.html 和 static 文件夹

将这个两个文件 放到 网络后台 静态网页服务器 就能显示 页面

例如 express 的static 文件路径

 

dev网站的运行端口设置 在 webpack.dev.conf.js

 

系统的启动文件:webpack.base.conf.js

entry: {

    app: './src/main.js'

  },

 

//后面的是个人理解,

每个 vue 文件 export default  代表输出一个组件吧 

组件的名字是XXX :name: 'XXX'

在js 里面倒入这个组件的地址 ./App

import App from './App'

//将它定义为组件

components: { App },

 

读取 https://www.jspang.com/的vue视频学习心得 谢谢jspang