美文网首页Parcel
让parcel也支持vue

让parcel也支持vue

作者: 神秘者007 | 来源:发表于2018-01-04 15:57 被阅读14次

相关链接(网友提供):

  1. parcel-plugin-vue

  2. parcel-demo

默认情况下 Parcel 是支持 React 和 Preact,可以通过查看下面这个页面得知。

https://parceljs.org/recipes.html

要让 Parcel 支持 vue,需要简单处理一下。(下面的方法是我尝试的,如果有更好的,欢迎评论留言)

首先初始化一个项目。

$ mkdir parcel-vue
$ cd parcel-vue
$ npm init -y

接着安装 vue。

$ npm install vue

index.html

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Parcel Vue</title>
</head>
<body>
  <div id="app">
    <h1>Hello Parcel</h1>
  </div>

  <script src="app.js"></script>
</body>
</html>

然后写一些 vue 的代码。

app.js

import Vue from 'vue/dist/vue.js';

const app = new Vue({
  el: '#app',
  template: `<h1>{{ name }}</h1>`,
  data() {
    return {
      name: '谢海涛'
    }
  }
})

最后,运行 parcel index.html,结果如下:

image.png

相关文章

  • 让parcel也支持vue

    相关链接(网友提供): parcel-plugin-vue parcel-demo 默认情况下 Parcel 是支...

  • parcel构建vue项目

    Parcel-vue 初体验 Parcel 是什么 和webpack一样,parcel也是模块打包器的一种。不过不...

  • parcel-vue

    使用parcel + vue的项目简单介绍 介绍 Parcel 手动搭建 快速构建 介绍 传统的webpack配置...

  • Parcel —— 零配置的模块打包工具

    目录 Parcel概述Parcel的背景Parcel的特点 快速上手HMR —— 模块热替换零配置自动安装依赖支持...

  • 全新打包工具parcel零配置vue开发脚手架

    parcel-vue一个基于parcel打包工具的 vue开发脚手架解决方案,强烈建议使用node8.0以上 项目...

  • 引用测试自己的vue组件

    --基于parcel 假设用户使用vue cli 关于旧版本 Vue CLI的包名称由vue-cli改成了@vue...

  • 自制UI框架

    代码使用文档 搭建 vue + parcel (后期改用vue-cli)测试采用 karma + mocha持续集...

  • 1.vue-loader如何实现.vue的处理(vue3.0版本

    首先基于webpack的打包构建,所以暂不考虑parcel。webpack处理.vue文件配置 在探究vue-lo...

  • parcel+vue

    1.简单的安装parcel cnpm i -g parcel-bundler 2.新建一个component文件新...

  • parcel+vue

    今天主要说的是用parcel+vue实现一个打包js选项卡的功能 每一张图片下面都贴心的给您附上了源代码 1.首先...

网友评论

    本文标题:让parcel也支持vue

    本文链接:https://www.haomeiwen.com/subject/tkirnxtx.html