打包工具 parcel

1. 创建一个项目
   进入目标目录
   使用 cd

cd Project

之后创建一个目录 mkdir demo

image.png

2. github 创建新的文件仓库
   使用 touch 创建文件

   
   image.png

3. init 仓库

image.png

创建一个 README.md

之后填写说明 vi README.md

之后 git add .

在之后提交 git commit -m "更新内容说明 "

image.png image.png

4. 提交本地仓库
   本地的仓库已经建好，远程仓库创建好的时候在里面有个如下的内容

image.png image.png

到了这一步 算是本地与远程仓库已经连接了

5. 添加开源协议MIT
   在github页面中，创建一个文件名 为 LICENSE，会出现一个按钮，点击进入新页面，选择
   MIT，一路默认

创建完之后，记得pull下来 使用命令 git pull

image.png

6. 创建npm
   npm init

image.png image.png

这时候在本地仓库中会多出一个package.json文件 将它上传到远程仓库

7.创建vue

image.png

8. 创建打包工具
   parcel

如果一个 npm 包是给用户使用的，不用加 -D。如果是给开发者使用，需要加 -D。（或者全局安装）

npm i -D parcel-bundler

image.png

9. 使用命令

npx parcel index.html --no-cache

刚开始的时候使用npx parcel index.html 会提示告诉你

image.png image.png

报错的意思是： 您正在使用Vue的只运行时构建，其中模板编译器不可用。要么将模板预编译为呈现函数，要么使用编译器包含的构建。

解决方法

image.png

Parcel
在你项目的 package.json 中添加：

{
  // ...
  "alias": {
    "vue" : "./node_modules/vue/dist/vue.common.js"
  }
}

后面的作用是
先清除第一次编译失败的缓存。或者在末尾使用 --no-cache

10.安装gitopen工具

npm -i -g git-open

使用的时候 直接在终端输入 git open 会打开github网页