Leahnaya/chaoticbackup.github.io
1
0
Fork 0
mirror of https://github.com/chaoticbackup/chaoticbackup.github.io.git synced 2026-03-21 17:24:14 -05:00
Code Issues Actions Packages Projects Releases Wiki Activity

[update] webpack 4 babel 7

Browse Source 
dependency hell
This commit is contained in:
Daniel 2019-01-05 01:21:56 -05:00
parent 62269e4c72
commit e08db864da
4 changed files with 71 additions and 115 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
.babelrc
View File

@ -1,4 +0,0 @@
{
"presets": ["env", "react", "stage-1"],
"plugins": ["transform-decorators-legacy"]
}

34
package.json
View File

@ -1,10 +1,10 @@
{
"name": "chaoticbackup",
"version": "1.4.0",
"version": "2.0.0",
"description": "Chaotic Backup",
"scripts": {
"start": "webpack-dev-server -d --inline --host 0.0.0.0 --history-api-fallback",
"build": "webpack -d"
"build": "webpack -p"
},
"repository": {
"type": "git",
@ -30,26 +30,30 @@
"whatwg-fetch": "^2.0.3"
},
"devDependencies": {
"babel-core": "^6.21.0",
"babel-eslint": "^10.0.0",
"babel-loader": "^7.1.5",
"babel-plugin-transform-decorators-legacy": "^1.3.4",
"babel-polyfill": "^6.26.0",
"babel-preset-env": "^1.6.1",
"babel-preset-react": "^6.16.0",
"babel-preset-stage-1": "^6.16.0",
"css-loader": "^1.0.0",
"@babel/cli": "^7.2.3",
"@babel/core": "^7.2.2",
"@babel/node": "^7.2.2",
"@babel/plugin-proposal-class-properties": "^7.2.3",
"@babel/plugin-proposal-decorators": "^7.2.3",
"@babel/plugin-transform-runtime": "^7.2.0",
"@babel/polyfill": "^7.2.5",
"@babel/preset-env": "^7.2.3",
"@babel/preset-flow": "^7.0.0",
"@babel/preset-react": "^7.0.0",
"@babel/register": "^7.0.0",
"babel-loader": "^8.0.5",
"css-loader": "^2.1.0",
"eslint": "^5.7.1",
"eslint-config-airbnb": "^17.1.0",
"eslint-plugin-import": "^2.2.0",
"eslint-plugin-jsx-a11y": "^6.1.2",
"eslint-plugin-react": "^7.0.0",
"extract-text-webpack-plugin": "^3.0.2",
"mini-css-extract-plugin": "^0.4.4",
"mini-css-extract-plugin": "^0.5.0",
"node-sass": "^4.10.0",
"sass-loader": "^7.0.x",
"style-loader": "^0.23.1",
"webpack": "^3.12.0",
"webpack-dev-server": "^2.11.3"
"webpack": "^4.28.3",
"webpack-cli": "^3.2.0",
"webpack-dev-server": "^3.1.14"
}
}

74
webpack.4.config.babel.js
View File

@ -1,74 +0,0 @@
import webpack from 'webpack';
import path from 'path';
const MiniCssExtractPlugin = require("mini-css-extract-plugin");
const devMode = process.env.NODE_ENV !== 'production'
export default {
entry: ['babel-polyfill', `${__dirname}/src/components/index.js`],
output: {
path: `${__dirname}/build`,
publicPath: '/build/',
filename: 'bundle.js',
},
optimization: {
splitChunks: {
cacheGroups: {
styles: {
name: 'styles',
test: /\.css$/,
chunks: 'all',
enforce: true
}
}
}
},
module: {
rules: [
{
test: /\.jsx?$/, exclude: /node_modules/,
use: 'babel-loader'
},
{
test: /\.s?[ac]ss$/,
use: [
devMode ? 'style-loader' : MiniCssExtractPlugin.loader,
'css-loader',
'sass-loader',
],
}
]
},
resolve: {
extensions: ['.js', '.jsx'],
},
node: {
fs: 'empty',
},
// First array is dev only, second is production
plugins: process.argv.indexOf('-p') === -1 ? [
new MiniCssExtractPlugin({
filename: devMode ? '[name].css' : '[name].[hash].css',
})
] : [
new webpack.DefinePlugin({
'process.env.NODE_ENV': JSON.stringify('production'),
}),
new webpack.optimize.UglifyJsPlugin({
output: {
comments: false,
},
warnings: true,
}),
new ExtractTextPlugin({
filename: 'style.css',
allChunks: true
})
],
};

74
webpack.config.babel.js
View File

@ -1,31 +1,58 @@
import webpack from 'webpack';
import path from 'path';
const path = require('path');
const MiniCssExtractPlugin = require("mini-css-extract-plugin");
const webpack = require('webpack');
require("@babel/register");
let ExtractTextPlugin = require('extract-text-webpack-plugin');
const devMode = (process.env.NODE_ENV !== 'production' && process.argv.indexOf('-p') === -1);
const config = {
entry: ["@babel/polyfill", `${__dirname}/src/components/index.js`],
export default {
entry: ['babel-polyfill', `${__dirname}/src/components/index.js`],
output: {
path: `${__dirname}/build`,
publicPath: '/build/',
filename: 'bundle.js',
},
optimization: {
splitChunks: {
cacheGroups: {
styles: {
name: 'styles',
test: /\.css$/,
chunks: 'all',
enforce: true
}
}
}
},
module: {
rules: [
{
test: /\.jsx?$/, exclude: /node_modules/,
use: 'babel-loader'
test: /\.(js|jsx)$/,
exclude: /node_modules/,
loader: 'babel-loader',
options: {
"presets": [
"@babel/preset-env",
"@babel/preset-react",
"@babel/preset-flow",
],
"plugins": [
"@babel/plugin-transform-runtime",
["@babel/plugin-proposal-decorators", {"legacy": true }],
["@babel/plugin-proposal-class-properties", { "loose": true }]
]
}
},
{
test: /\.scss$/,
use: ExtractTextPlugin.extract({
fallback: 'style-loader',
use: [
{loader: 'css-loader', options: { sourceMap: true }},
{loader: 'sass-loader', options: { sourceMap: true }},
]
})
test: /\.s?[ac]ss$/,
use: [
devMode ? 'style-loader' : MiniCssExtractPlugin.loader,
'css-loader',
'sass-loader',
],
}
]
},
@ -39,10 +66,10 @@ export default {
},
// First array is dev only, second is production
plugins: process.argv.indexOf('-p') === -1 ? [
new ExtractTextPlugin({
filename: 'style.css',
allChunks: true
plugins: devMode ? [
new MiniCssExtractPlugin({
filename: '[name].css',
chunkFilename: '[id].css',
})
] : [
new webpack.DefinePlugin({
@ -54,9 +81,12 @@ export default {
},
warnings: true,
}),
new ExtractTextPlugin({
filename: 'style.css',
allChunks: true
new MiniCssExtractPlugin({
filename: '[name].[hash].css',
chunkFilename: '[id].[hash].css',
})
],
};
// Exports
module.exports = config;