Skip to content

Commit

Permalink
Optimizing Pro Config
Browse files Browse the repository at this point in the history
  • Loading branch information
chaos committed Jun 6, 2019
1 parent 250ffe8 commit 7588b6e
Show file tree
Hide file tree
Showing 8 changed files with 200 additions and 151 deletions.
1 change: 1 addition & 0 deletions dist/app-e94b2ec.css

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

1 change: 1 addition & 0 deletions dist/app-e94b2ec.js

Large diffs are not rendered by default.

Binary file added dist/assets/logo-4e9b7ef.png
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
1 change: 1 addition & 0 deletions dist/index.html
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
<!DOCTYPE html><html lang=en><head><meta charset=UTF-8><meta name=viewport content="width=device-width,initial-scale=1"><meta http-equiv=X-UA-Compatible content="ie=edge"><title>mithril-starter-kit</title><link href=app-e94b2ec.css rel=stylesheet></head><body><div id=app></div><script type=text/javascript src=app-e94b2ec.js></script></body></html>
15 changes: 10 additions & 5 deletions package.json
Original file line number Diff line number Diff line change
@@ -1,17 +1,21 @@
{
"name": "mithril-starter-kit",
"version": "0.0.1",
"description": "",
"version": "0.1.0",
"description": "A boilerplate Mithril application With Webpack",
"main": "index.js",
"scripts": {
"build": "webpack --progress --config webpack.pro.js",
"build": "webpack --config webpack.pro.js --progress",
"dev": "webpack-dev-server --config webpack.dev.js"
},
"repository": {
"type": "git",
"url": "git+https://github.com/mojowork/mithril-starter-kit.git"
},
"keywords": [],
"keywords": [
"mithril",
"Webpack",
"boilerplate"
],
"author": "chaos",
"license": "ISC",
"bugs": {
Expand All @@ -32,11 +36,12 @@
"css-loader": "^2.1.1",
"cssnano": "^4.1.10",
"file-loader": "^3.0.1",
"glob": "^7.1.4",
"glob-all": "^3.1.0",
"html-webpack-plugin": "^3.2.0",
"less": "^3.9.0",
"less-loader": "^5.0.0",
"mini-css-extract-plugin": "^0.6.0",
"optimize-css-assets-webpack-plugin": "^5.0.1",
"postcss-loader": "^3.0.0",
"purify-css": "^1.2.5",
"purifycss-webpack": "^0.7.0",
Expand Down
17 changes: 8 additions & 9 deletions src/views/app.js
Original file line number Diff line number Diff line change
@@ -1,11 +1,10 @@

const App = {
view: () => (
<main>
<img src={require('../assets/logo.png')}/>
<h1>Hello Mithril</h1>
</main>
)
}
view: () =>
m(
"main",
m("img", { src: require("../assets/logo.png") }),
m("h1", "Hello Mithril ")
)
};

export default App
export default App;
193 changes: 105 additions & 88 deletions webpack.dev.js
Original file line number Diff line number Diff line change
Expand Up @@ -3,94 +3,111 @@ const path = require('path');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const MiniCssExtractPlugin = require("mini-css-extract-plugin");

let config = { // config object
mode: 'development',
entry: {
app: './src/index.js', // entry file
},
output: { // output
path: path.resolve(__dirname, 'dist'), // ouput path
filename: '[name].js',
},
module: {
rules: [
{
test: /\.jsx?$/,
use: [
{
loader: 'babel-loader',
options: {
presets: ['@babel/preset-env'],
plugins: [
['transform-react-jsx', { // jsx
'pragma': 'm',
}],
],
}
}]
},
{
test: /\.(le|c)ss$/,
use: [
{
loader: 'css-hot-loader' //css hot
},
{
loader: MiniCssExtractPlugin.loader
},
{
loader: 'css-loader',
// Not Use modules
// options: {
// modules: true,
// localIdentName: '[name]_[local]_[hash:7]'
// },
},
{
loader: 'postcss-loader',
options: {
ident: 'postcss',
plugins: (loader) => [
require('autoprefixer')()
]
}
},
{
loader: 'less-loader',
}
let config = {
// config object
mode: "development",
entry: {
app: "./src/index.js" // entry file
},
output: {
// output
path: path.resolve(__dirname, "dist"), // ouput path
filename: "[name].js"
},
module: {
rules: [
{
test: /\.jsx?$/,
use: [
{
loader: "babel-loader",
options: {
presets: ["@babel/preset-env"],
plugins: [
[
"transform-react-jsx",
{
// jsx
pragma: "m"
}
]
},
{
test: /\.(png|gif|jpe?g|svg)$/i,
use: [{
loader: 'url-loader',
options: {
name: '[name].[ext]?[hash:7]',
limit: 8192,
outputPath: 'assets/'
}
}]
},
] // end rules
},
plugins: [ // webpack plugins
new HtmlWebpackPlugin({
template: 'index.html',
filename: 'index.html'
}),
new MiniCssExtractPlugin({
filename: '[name].css',
}),
new webpack.ProvidePlugin({
m: 'mithril', //Global access
}),
],
devServer: {
contentBase: path.join(__dirname, 'dist'),
hot: true,
open: true
},
devtool: 'eval-source-map', // enable devtool for better debugging experience
}
]
}
}
]
},
{
test: /\.(le|c)ss$/,
use: [
{
loader: "css-hot-loader" //css hot
},
{
loader: MiniCssExtractPlugin.loader
},
{
loader: "css-loader"
// Not Use modules
// options: {
// modules: true,
// localIdentName: '[name]_[local]_[hash:7]'
// },
},
{
loader: "postcss-loader",
options: {
plugins: [require("autoprefixer")]
}
},
{
loader: "less-loader"
}
]
},
// {
// test: /\.(eot|svg|ttf|woff2?)$/,
// use: [{
// loader: 'file-loader',
// options: {
// name: '[name]-[hash:7].[ext]',
// outputPath: 'assets/fonts'
// }
// }]
// },
{
test: /\.(png|gif|jpe?g|svg)$/i,
use: [
{
loader: "url-loader",
options: {
name: "[name].[ext]",
limit: 8192,
outputPath: "assets/"
}
}
]
}
] // end rules
},
plugins: [
// webpack plugins
new HtmlWebpackPlugin({
template: "index.html",
filename: "index.html"
}),
new MiniCssExtractPlugin({
filename: "[name].css"
}),
new webpack.ProvidePlugin({
m: "mithril" //Global access
})
],
devServer: {
contentBase: path.join(__dirname, "dist"),
hot: true,
open: true
},
devtool: "eval-source-map" // enable devtool for better debugging experience
};

module.exports = config;
Loading

0 comments on commit 7588b6e

Please sign in to comment.