Skip to content

Commit 9a9fc62

Browse files
author
Shaun Pelling
committed
added code
1 parent f59f94f commit 9a9fc62

File tree

13 files changed

+202
-66
lines changed

13 files changed

+202
-66
lines changed

.babelrc

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
{
2+
"presets": [
3+
["latest", {
4+
"es2015": { "modules": false }
5+
}]
6+
]
7+
}

.gitignore

Lines changed: 5 additions & 37 deletions
Original file line numberDiff line numberDiff line change
@@ -1,37 +1,5 @@
1-
# Logs
2-
logs
3-
*.log
4-
npm-debug.log*
5-
6-
# Runtime data
7-
pids
8-
*.pid
9-
*.seed
10-
11-
# Directory for instrumented libs generated by jscoverage/JSCover
12-
lib-cov
13-
14-
# Coverage directory used by tools like istanbul
15-
coverage
16-
17-
# nyc test coverage
18-
.nyc_output
19-
20-
# Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files)
21-
.grunt
22-
23-
# node-waf configuration
24-
.lock-wscript
25-
26-
# Compiled binary addons (http://nodejs.org/api/addons.html)
27-
build/Release
28-
29-
# Dependency directories
30-
node_modules
31-
jspm_packages
32-
33-
# Optional npm cache directory
34-
.npm
35-
36-
# Optional REPL history
37-
.node_repl_history
1+
.DS_Store
2+
node_modules/
3+
dist/
4+
npm-debug.log
5+
yarn-error.log

README.md

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
# cli-project
2+
3+
> A Vue.js project
4+
5+
## Build Setup
6+
7+
``` bash
8+
# install dependencies
9+
npm install
10+
11+
# serve with hot reload at localhost:8080
12+
npm run dev
13+
14+
# build for production with minification
15+
npm run build
16+
```
17+
18+
For detailed explanation on how things work, consult the [docs for vue-loader](http://vuejs.github.io/vue-loader).

app.js

Lines changed: 0 additions & 12 deletions
This file was deleted.

img/bag-burst.png

-13.6 KB
Binary file not shown.

img/bag.png

-6.98 KB
Binary file not shown.

index.html

Lines changed: 9 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -1,19 +1,11 @@
11
<!DOCTYPE html>
2-
<html>
3-
<head>
4-
<meta charset="utf-8">
5-
<title>VueJS Tutorials</title>
6-
<link href="styles.css" rel="stylesheet" />
7-
<script src="https://unpkg.com/vue"></script>
8-
</head>
9-
<body>
10-
<h1>Refs</h1>
11-
<div id="vue-app-one">
12-
<input type="text" ref="input" />
13-
<button v-on:click="readRefs">Submit</button>
14-
<p>{{ output }}</p>
15-
</div>
16-
</body>
17-
18-
<script src="app.js"></script>
2+
<html lang="en">
3+
<head>
4+
<meta charset="utf-8">
5+
<title>cli-project</title>
6+
</head>
7+
<body>
8+
<div id="app"></div>
9+
<script src="/dist/build.js"></script>
10+
</body>
1911
</html>

package.json

Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
{
2+
"name": "vuejs-playlist",
3+
"description": "A Vue.js project",
4+
"version": "1.0.0",
5+
"author": "Shaun",
6+
"private": true,
7+
"scripts": {
8+
"dev": "cross-env NODE_ENV=development webpack-dev-server --open --hot",
9+
"build": "cross-env NODE_ENV=production webpack --progress --hide-modules"
10+
},
11+
"dependencies": {
12+
"vue": "^2.2.1"
13+
},
14+
"devDependencies": {
15+
"babel-core": "^6.0.0",
16+
"babel-loader": "^6.0.0",
17+
"babel-preset-latest": "^6.0.0",
18+
"cross-env": "^3.0.0",
19+
"css-loader": "^0.25.0",
20+
"file-loader": "^0.9.0",
21+
"vue-loader": "^11.1.4",
22+
"vue-template-compiler": "^2.2.1",
23+
"webpack": "^2.2.0",
24+
"webpack-dev-server": "^2.2.0"
25+
}
26+
}

src/App.vue

Lines changed: 60 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,60 @@
1+
<template>
2+
<div id="app">
3+
<img src="./assets/logo.png">
4+
<h1></h1>
5+
<h2>Essential Links</h2>
6+
<ul>
7+
<li><a href="https://vuejs.org" target="_blank">Core Docs</a></li>
8+
<li><a href="https://forum.vuejs.org" target="_blank">Forum</a></li>
9+
<li><a href="https://gitter.im/vuejs/vue" target="_blank">Gitter Chat</a></li>
10+
<li><a href="https://twitter.com/vuejs" target="_blank">Twitter</a></li>
11+
</ul>
12+
<h2>Ecosystem</h2>
13+
<ul>
14+
<li><a href="http://router.vuejs.org/" target="_blank">vue-router</a></li>
15+
<li><a href="http://vuex.vuejs.org/" target="_blank">vuex</a></li>
16+
<li><a href="http://vue-loader.vuejs.org/" target="_blank">vue-loader</a></li>
17+
<li><a href="https://github.com/vuejs/awesome-vue" target="_blank">awesome-vue</a></li>
18+
</ul>
19+
</div>
20+
</template>
21+
22+
<script>
23+
export default {
24+
name: 'app',
25+
data () {
26+
return {
27+
msg: 'Welcome to Your Vue.js App'
28+
}
29+
}
30+
}
31+
</script>
32+
33+
<style>
34+
#app {
35+
font-family: 'Avenir', Helvetica, Arial, sans-serif;
36+
-webkit-font-smoothing: antialiased;
37+
-moz-osx-font-smoothing: grayscale;
38+
text-align: center;
39+
color: #2c3e50;
40+
margin-top: 60px;
41+
}
42+
43+
h1, h2 {
44+
font-weight: normal;
45+
}
46+
47+
ul {
48+
list-style-type: none;
49+
padding: 0;
50+
}
51+
52+
li {
53+
display: inline-block;
54+
margin: 0 10px;
55+
}
56+
57+
a {
58+
color: #42b983;
59+
}
60+
</style>

src/assets/logo.png

6.69 KB
Loading

src/main.js

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
import Vue from 'vue'
2+
import App from './App.vue'
3+
4+
new Vue({
5+
el: '#app',
6+
render: h => h(App)
7+
})

styles.css

Whitespace-only changes.

webpack.config.js

Lines changed: 70 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,70 @@
1+
var path = require('path')
2+
var webpack = require('webpack')
3+
4+
module.exports = {
5+
entry: './src/main.js',
6+
output: {
7+
path: path.resolve(__dirname, './dist'),
8+
publicPath: '/dist/',
9+
filename: 'build.js'
10+
},
11+
module: {
12+
rules: [
13+
{
14+
test: /\.vue$/,
15+
loader: 'vue-loader',
16+
options: {
17+
loaders: {
18+
}
19+
// other vue-loader options go here
20+
}
21+
},
22+
{
23+
test: /\.js$/,
24+
loader: 'babel-loader',
25+
exclude: /node_modules/
26+
},
27+
{
28+
test: /\.(png|jpg|gif|svg)$/,
29+
loader: 'file-loader',
30+
options: {
31+
name: '[name].[ext]?[hash]'
32+
}
33+
}
34+
]
35+
},
36+
resolve: {
37+
alias: {
38+
'vue$': 'vue/dist/vue.esm.js'
39+
}
40+
},
41+
devServer: {
42+
historyApiFallback: true,
43+
noInfo: true
44+
},
45+
performance: {
46+
hints: false
47+
},
48+
devtool: '#eval-source-map'
49+
}
50+
51+
if (process.env.NODE_ENV === 'production') {
52+
module.exports.devtool = '#source-map'
53+
// http://vue-loader.vuejs.org/en/workflow/production.html
54+
module.exports.plugins = (module.exports.plugins || []).concat([
55+
new webpack.DefinePlugin({
56+
'process.env': {
57+
NODE_ENV: '"production"'
58+
}
59+
}),
60+
new webpack.optimize.UglifyJsPlugin({
61+
sourceMap: true,
62+
compress: {
63+
warnings: false
64+
}
65+
}),
66+
new webpack.LoaderOptionsPlugin({
67+
minimize: true
68+
})
69+
])
70+
}

0 commit comments

Comments
 (0)