migrate to webpack
amphineko
2
.gitignore
vendored
@ -1,2 +1,2 @@
|
||||
bower_components
|
||||
dist
|
||||
node_modules
|
||||
6423
package-lock.json
generated
21
package.json
@ -2,7 +2,6 @@
|
||||
"name": "amphineko",
|
||||
"version": "0.0.1",
|
||||
"description": "",
|
||||
"main": "gulpfile.js",
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "git+https://github.com/amphineko/amphineko.git"
|
||||
@ -14,13 +13,21 @@
|
||||
},
|
||||
"homepage": "https://futa.moe/amphineko/",
|
||||
"scripts": {
|
||||
"build": "node ./node_modules/gulp/bin/gulp.js"
|
||||
"build": "webpack"
|
||||
},
|
||||
"devDependencies": {
|
||||
"gulp": "^4.0.0",
|
||||
"gulp-clean-css": "^3.9.4",
|
||||
"gulp-rename": "^1.2.3",
|
||||
"gulp-sass": "^4.0.1",
|
||||
"unsemantic": "^1.2.3"
|
||||
"browser-sync": "^2.26.3",
|
||||
"browser-sync-webpack-plugin": "^2.2.2",
|
||||
"css-loader": "^2.1.1",
|
||||
"extract-loader": "^3.1.0",
|
||||
"file-loader": "^3.0.1",
|
||||
"html-loader": "^0.5.5",
|
||||
"mini-css-extract-plugin": "^0.5.0",
|
||||
"node-sass": "^4.11.0",
|
||||
"resolve-url-loader": "^3.1.0",
|
||||
"sass-loader": "^7.1.0",
|
||||
"style-loader": "^0.23.1",
|
||||
"unsemantic": "^1.2.3",
|
||||
"webpack": "^4.29.6"
|
||||
}
|
||||
}
|
||||
|
||||
|
Before Width: | Height: | Size: 2.0 MiB After Width: | Height: | Size: 2.0 MiB |
|
Before Width: | Height: | Size: 172 KiB After Width: | Height: | Size: 172 KiB |
|
Before Width: | Height: | Size: 2.1 KiB After Width: | Height: | Size: 2.1 KiB |
|
Before Width: | Height: | Size: 581 B After Width: | Height: | Size: 581 B |
@ -2,7 +2,7 @@
|
||||
@import "fontawesome/brands.scss";
|
||||
@import "fontawesome/regular.scss";
|
||||
@import "fontawesome/solid.scss";
|
||||
@import "../../node_modules/unsemantic/assets/sass/unsemantic-grid-responsive.scss";
|
||||
@import "../../../node_modules/unsemantic/assets/sass/unsemantic-grid-responsive.scss";
|
||||
|
||||
@import "footer.scss";
|
||||
@import "header.scss";
|
||||
|
Before Width: | Height: | Size: 697 KiB After Width: | Height: | Size: 697 KiB |
|
Before Width: | Height: | Size: 137 KiB After Width: | Height: | Size: 137 KiB |
|
Before Width: | Height: | Size: 729 KiB After Width: | Height: | Size: 729 KiB |
@ -1,7 +1,7 @@
|
||||
<html>
|
||||
|
||||
<head>
|
||||
<link href="assets/stylesheets/index.bundle.min.css" rel="stylesheet">
|
||||
<link href="index.css" rel="stylesheet">
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1" />
|
||||
<title>about amphineko</title>
|
||||
2
src/index.js
Normal file
@ -0,0 +1,2 @@
|
||||
require('html-loader!./index.html')
|
||||
require('sass-loader?name=[name].[ext]!./assets/stylesheets/index.scss')
|
||||
65
webpack.config.js
Normal file
@ -0,0 +1,65 @@
|
||||
const path = require('path')
|
||||
|
||||
const BrowserSyncPlugin = require('browser-sync-webpack-plugin')
|
||||
const MiniCssExtractPlugin = require("mini-css-extract-plugin")
|
||||
|
||||
module.exports = {
|
||||
context: path.resolve(__dirname, 'src'),
|
||||
|
||||
entry: {
|
||||
index: './index.js',
|
||||
},
|
||||
|
||||
module: {
|
||||
rules: [
|
||||
{
|
||||
test: /\.(eot|jpg|png|svg|ttf|woff2?)$/,
|
||||
loader: 'file-loader',
|
||||
options: {
|
||||
name: '[path][name].[ext]',
|
||||
},
|
||||
},
|
||||
{
|
||||
test: /\.(html)$/,
|
||||
use: [
|
||||
'file-loader?name=[name].[ext]',
|
||||
'extract-loader',
|
||||
{
|
||||
loader: 'html-loader',
|
||||
options: {
|
||||
minimize: true,
|
||||
removeComments: false,
|
||||
collapseWhitespace: false
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
test: /\.(c|sa|sc)ss$/,
|
||||
use: [
|
||||
MiniCssExtractPlugin.loader,
|
||||
'css-loader',
|
||||
'resolve-url-loader',
|
||||
"sass-loader",
|
||||
],
|
||||
},
|
||||
],
|
||||
},
|
||||
|
||||
output: {
|
||||
filename: 'index.bundle.js',
|
||||
path: path.resolve(__dirname, 'dist'),
|
||||
},
|
||||
|
||||
plugins: [
|
||||
new BrowserSyncPlugin({
|
||||
host: 'localhost',
|
||||
port: 3000,
|
||||
server: { baseDir: ['dist'] },
|
||||
}),
|
||||
new MiniCssExtractPlugin({
|
||||
chunkFilename: '[id].css',
|
||||
filename: '[name].css',
|
||||
}),
|
||||
],
|
||||
}
|
||||