Add aptoprefixer and format webpack config

This commit is contained in:
Anton Vakhrushev 2018-06-24 11:54:41 +03:00
parent a06113f919
commit 9125f92432
4 changed files with 1821 additions and 2808 deletions

View File

@ -14,6 +14,7 @@ build-prod:
./tools/npm run build-prod
format:
./tools/npm run format-webpack
./tools/npm run format-js
./tools/npm run format-vue
./tools/npm run format-style

4507
package-lock.json generated

File diff suppressed because it is too large Load Diff

View File

@ -5,27 +5,30 @@
"version": "1.0.0",
"description": "Homepage",
"devDependencies": {
"autoprefixer": "^8.6.3",
"babel-core": "^6.26.3",
"babel-loader": "^7.1.4",
"babel-preset-env": "^1.6.1",
"babel-preset-env": "^1.7.0",
"css-loader": "^0.28.11",
"node-sass": "^4.9.0",
"postcss-loader": "^2.1.5",
"predictor": "git+https://github.com/anwinged/predictor.git",
"prettier": "^1.13.5",
"sass-loader": "^7.0.1",
"sass-loader": "^7.0.3",
"style-loader": "^0.21.0",
"underscore": "^1.9.0",
"underscore": "^1.9.1",
"vue": "^2.5.16",
"vue-loader": "^15.2.4",
"vue-style-loader": "^4.1.0",
"vue-template-compiler": "^2.5.16",
"webpack": "^4.5.0",
"webpack-cli": "^2.0.14"
"webpack": "^4.12.0",
"webpack-cli": "^2.1.5"
},
"scripts": {
"watch": "",
"build": "webpack --config webpack.config.js --progress",
"build-prod": "webpack --config webpack.config.js --env.production",
"format-webpack": "prettier --single-quote --trailing-comma es5 --write \"./webpack.config.js\"",
"format-js": "prettier --single-quote --trailing-comma es5 --write \"./source/_assets/**/*.js\"",
"format-vue": "prettier --single-quote --trailing-comma es5 --write \"./source/_assets/**/*.vue\"",
"format-style": "prettier --single-quote --write \"source/_assets/**/*.scss\"",

View File

@ -1,12 +1,54 @@
const path = require('path');
const VueLoaderPlugin = require('vue-loader/lib/plugin')
const autoprefixer = require('autoprefixer');
const VueLoaderPlugin = require('vue-loader/lib/plugin');
module.exports = income_env => {
const env = income_env || {};
module.exports = (env = {}) => {
const is_prod = !!env.production;
const dist_dir = is_prod ? 'output_prod' : 'output_dev';
const dist_dir = is_prod ? './output_prod' : './output_dev';
const STYLE_LOADER = { loader: 'style-loader' };
const CSS_LOADER = {
loader: 'css-loader',
options: {
importLoaders: true,
},
};
const POSTCSS_LOADER = {
loader: 'postcss-loader',
options: {
plugins: [
autoprefixer({
browsers: ['last 8 version'],
}),
],
},
};
const SCSS_LOADER = { loader: 'sass-loader' };
const BABEL_LOADER = {
loader: 'babel-loader',
options: {
presets: ['babel-preset-env'],
},
};
const VUE_LOADER = {
loader: 'vue-loader',
options: {
loaders: {
css: ['vue-style-loader', CSS_LOADER, POSTCSS_LOADER],
scss: [
'vue-style-loader',
CSS_LOADER,
POSTCSS_LOADER,
'sass-loader',
],
},
},
};
return {
mode: is_prod ? 'production' : 'development',
@ -25,37 +67,27 @@ module.exports = income_env => {
{
test: /\.js$/,
exclude: /node_modules/,
use: {
loader: 'babel-loader',
options: {
presets: ['babel-preset-env']
}
},
use: [BABEL_LOADER],
},
{
test: /\.css$/,
use: ['style-loader', 'css-loader'],
use: [STYLE_LOADER, CSS_LOADER, POSTCSS_LOADER],
},
{
test: /\.scss$/,
use: ['style-loader', 'css-loader', 'sass-loader'],
use: [
STYLE_LOADER,
CSS_LOADER,
POSTCSS_LOADER,
SCSS_LOADER,
],
},
{
test: /\.vue$/,
loader: 'vue-loader',
options: {
loaders: {
'css': 'vue-style-loader!css-loader',
'scss': 'vue-style-loader!css-loader!sass-loader',
'sass': 'vue-style-loader!css-loader!sass-loader?indentedSyntax'
}
}
use: [VUE_LOADER],
},
]
},
plugins: [
new VueLoaderPlugin(),
],
}
},
plugins: [new VueLoaderPlugin()],
};
};