Answer the question
In order to leave comments, you need to log in
How to overwrite css and js files via output: path:?
Good afternoon, there is a webpack build in the project, the
production files are 4 folders up
/public_html/assets/js/app.js
/public_html/assets/css/styles.css
the problem is that app.js and styles.css are not overwritten during build and accordingly do not get into the commit
editor of the php storm
config
let path = require('path');
let webpack = require('webpack');
let globImporter = require('node-sass-glob-importer');
let autoprefixer = require('autoprefixer');
let postcssclick = require('postcss-click');
let backgroundSvg = require('postcss-encode-background-svgs');
let cssnext = require('postcss-preset-env');
let animation = require('postcss-animation');
let TerserJSPlugin = require('terser-webpack-plugin');
let MiniCssExtractPlugin = require('mini-css-extract-plugin');
let OptimizeCSSAssetsPlugin = require('optimize-css-assets-webpack-plugin');
let conf = {
mode: 'production',
entry: './index.js',
output: {
path: path.resolve(__dirname, '../../../../public_html/assets/'),
filename: './js/app.js'
},
optimization: {
minimizer: [new TerserJSPlugin({}), new OptimizeCSSAssetsPlugin({})],
},
devServer: {
overlay: true,
port: 3010
},
module: {
rules: [
{
test: /\.m?js$/,
exclude: "/node_modules/",
use: {
loader: 'babel-loader',
options: {
presets: ['@babel/preset-env']
}
}
},
{
test: /\.(sa|sc|c)ss$/,
use: [
MiniCssExtractPlugin.loader,
{
loader: "css-loader",
options: {
sourceMap: true,
url:false,
}
},
{
loader: 'postcss-loader',
options: {
plugins: [
postcssclick(),
cssnext(),
animation()
],
sourceMap: true,
}
},
{
loader: 'sass-loader',
options: {
sassOptions: {
importer: globImporter(),
sourceMap: true,
}
}
}
],
}
]
},
plugins: [
new MiniCssExtractPlugin({
filename: '/css/styles.css',
})
]
};
module.exports = conf;
Answer the question
In order to leave comments, you need to log in
Didn't find what you were looking for?
Ask your questionAsk a Question
731 491 924 answers to any question