使用webpack+npm创建项目

  1. 使用终端进入项目存放位置
    使用webpack+npm创建项目_第1张图片

  2. 全局安装vue
    npm i vue -g
    npm i vue-cli -g
    使用webpack+npm创建项目_第2张图片

  3. 进行下载项目
    vue init webpack 20180823
    使用webpack+npm创建项目_第3张图片

打开项目存放地址:可以看到项目已创建完成
使用webpack+npm创建项目_第4张图片

  1. 下载项目依赖安装包
    a 进入下载项目
    使用webpack+npm创建项目_第5张图片

b 输入 npm install 下载项目依赖的相关安装包
使用webpack+npm创建项目_第6张图片

  1. 启动项目
    输入 npm run dev 启动项目
    在地址栏输入127.0.0.1:8080
    8080是默认端口号
    这里写图片描述

项目结构:
使用webpack+npm创建项目_第7张图片

build:打包配置的配置文件所在文件夹
config:相关配置文件的文件夹
src:前端源码文件
App.vue:项目入口组件,.vue结尾的都是组件
main.js项目入口js
static:存放静态资源,例如:图片等
baletrc:es6解析配置
editorconfig:编辑器配置文件
gitignore:git忽略配置,项目将不会进行提交
index.html:单页面入口
package.json:项目配置文件,项目描述,项目版本号,项目依赖安装库等

你可能感兴趣的:(小知识点细节)