javascript – 如何将CSS文件从源文件夹捆绑并复制到dist文件夹?

这是我的文件夹结构:

我想缩小并捆绑我的src / css文件夹中的CSS文件,并将其作为单个CSS文件输出dist中.到目前为止,我看到的所有示例都建议在JS文件中需要CSS文件.我不要那个.有没有办法在webpack.config.js中配置只是缩小和复制这些文件

解决方法

搞定了.

安装dev-dependecies

npm i extract-text-webpack-plugin --save-dev
npm i css-loader --save-dev

webpack.config.js

const webpack = require('webpack');
const ExtractTextPlugin = require('extract-text-webpack-plugin')
const extractCSS = new ExtractTextPlugin('bundle.min.css')

module.exports = {
  entry: {
    'bundle.min.css': [
      __dirname + '/src/styles/abc.css',__dirname + '/src/styles/xyz.css',__dirname + '/src/styles/mno.css'
    ]
  },devtool: '',output: {
    path: __dirname + '/dist/styles/',filename: '[name]'

  },module: {
    rules: [{
        test: /\.css$/i,use: extractCSS.extract({
          use: {
            loader: 'css-loader',options: {
              minimize: true
            }
          }
        })
    }]
  },resolve: {
    alias: {},modules: [],extensions: ['.css']
  },plugins: [
    extractCSS
  ]
};

bundle.min.css将生成.基于最小化:真/假,将决定缩小.请享用!

相关文章

前言 做过web项目开发的人对layer弹层组件肯定不陌生,作为l...
前言 前端表单校验是过滤无效数据、假数据、有毒数据的第一步...
前言 图片上传是web项目常见的需求,我基于之前的博客的代码...
前言 导出Excel文件这个功能,通常都是在后端实现返回前端一...
前言 众所周知,js是单线程的,从上往下,从左往右依次执行,...
前言 项目开发中,我们可能会碰到这样的需求:select标签,禁...