Parcourir la source

Added dev server for faster development

master
Ray Burgemeestre il y a 6 ans
Parent
révision
00f41a13b3
6 fichiers modifiés avec 1500 ajouts et 6 suppressions
  1. +7
    -1
      README.md
  2. +3
    -0
      dist/index.html
  3. +1466
    -0
      package-lock.json
  4. +5
    -2
      package.json
  5. +1
    -1
      src/App.vue
  6. +18
    -2
      webpack.config.js

+ 7
- 1
README.md Voir le fichier

@@ -1,2 +1,8 @@
Followed this readme
Followed this readme for webpack:
https://webpack.js.org/guides/getting-started/

Followed this for bulma:
https://bulma.io/documentation/customize/with-webpack/

For vuejs:
https://itnext.io/vuejs-and-webpack-4-from-scratch-part-1-94c9c28a534a

+ 3
- 0
dist/index.html Voir le fichier

@@ -8,7 +8,10 @@
<body>
<div id="app"></div>
<div id="container" style="width:800px; height:600px;"></div>
<!-- for development commented out
<script src="main.js"></script>
-->

<div id="my-statusbar"></div>
<h1 class="title">
Bulma

+ 1466
- 0
package-lock.json
Fichier diff supprimé car celui-ci est trop grand
Voir le fichier


+ 5
- 2
package.json Voir le fichier

@@ -5,7 +5,8 @@
"private": true,
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
"build": "webpack"
"build": "webpack",
"dev": "webpack-dev-server --config webpack.config.js"
},
"author": "",
"license": "ISC",
@@ -13,6 +14,7 @@
"bulma": "^0.7.2",
"css-loader": "^1.0.0",
"extract-text-webpack-plugin": "^4.0.0-beta.0",
"html-webpack-plugin": "^3.2.0",
"node-sass": "^4.9.4",
"sass-loader": "^7.1.0",
"style-loader": "^0.23.1",
@@ -20,7 +22,8 @@
"vue-style-loader": "^4.1.2",
"vue-template-compiler": "^2.5.17",
"webpack": "^4.21.0",
"webpack-cli": "^3.1.2"
"webpack-cli": "^3.1.2",
"webpack-dev-server": "^3.1.9"
},
"dependencies": {
"lodash": "^4.17.11",

+ 1
- 1
src/App.vue Voir le fichier

@@ -1,6 +1,6 @@
<template>
<div>
<h1>Hello World!</h1>
<h1>Hello World wWohoo!</h1>
</div>
</template>


+ 18
- 2
webpack.config.js Voir le fichier

@@ -1,10 +1,20 @@
const path = require('path');
const webpack = require('webpack');
const MonacoWebpackPlugin = require('monaco-editor-webpack-plugin');
const ExtractTextPlugin = require("extract-text-webpack-plugin");
const { VueLoaderPlugin } = require('vue-loader')
const { VueLoaderPlugin } = require('vue-loader');
const HtmlWebpackPlugin = require('html-webpack-plugin');

module.exports = {
mode: 'development', // change to production when ready

devServer: {
hot: true,
watchOptions: {
poll: true
}
},

entry: './src/index.js',
output: {
filename: 'main.js',
@@ -33,6 +43,12 @@ module.exports = {
]
},
plugins: [
new webpack.HotModuleReplacementPlugin(), // for development
new HtmlWebpackPlugin({
filename: 'index.html',
template: 'dist/index.html',
inject: true
}), // for development
new MonacoWebpackPlugin(),
new ExtractTextPlugin('css/mystyles.css'),
new VueLoaderPlugin()

Chargement…
Annuler
Enregistrer