https://github.com/aaronksaunders/parcel-vue-sample
sample application using parcel zero config bundler with vuejs
https://github.com/aaronksaunders/parcel-vue-sample
parcel-vue parceljs vuejs zero-configuration
Last synced: 2 months ago
JSON representation
sample application using parcel zero config bundler with vuejs
- Host: GitHub
- URL: https://github.com/aaronksaunders/parcel-vue-sample
- Owner: aaronksaunders
- Created: 2018-04-17T02:34:17.000Z (about 7 years ago)
- Default Branch: master
- Last Pushed: 2018-04-17T02:44:16.000Z (about 7 years ago)
- Last Synced: 2025-01-21T20:11:26.102Z (4 months ago)
- Topics: parcel-vue, parceljs, vuejs, zero-configuration
- Language: Vue
- Size: 38.1 KB
- Stars: 0
- Watchers: 3
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: readme.md
Awesome Lists containing this project
README
# Parcel with Vue.js
Blazing fast, zero configuration web application bundler
- https://parceljs.org/
## Getting Started
create new project directory and run the following commands in the new directory
```
npm install --save vue
npm install --save-dev parcel-bundler
```
Add the following lines in the newly create `package.json` file
```
"scripts": {
"start": "parcel index.html"
}
```
Create an `index.html` file with the following code
```html
Parcel Vue.js Example
```
Create a `src` directory and add the file `app.js` and add the basic information for a `vue.js` application
```javascript
import Vue from 'vue'
import App from './App.vue'
/* eslint-disable no-new */
new Vue({
el: '#app',
render: h => h(App),
])
```
finally create a vue file `App.vue`
```javascript
Hello {{ title }} 🚀
📦 Parcel Vue.js using v1.7
export default {
name: "app",
data() {
return {
title: "Vue.js with Parcel"
};
}
};
#app {
font-family: Helvetica, Arial, sans-serif;
text-align: center;
color: #333333;
margin-top: 60px;
}
```
now in the terminal type the following
```console
yarn run start
```
## Referenced Content
- vuejs.org
- https://github.com/parcel-bundler/parcel/issues/732
- http://blog.rangle.io/finding-your-gateway-to-learning-vue/