扫码关注官方订阅号
官网上的写法是这样结果我写完之后
运行发现依然报错
说是配置文件找不到这个api,不知道什么原因
ringa_lee
一个完整的例子webpack.config.js
const path = require('path'); const webpack = require('webpack'); const ExtractTextPlugin = require('extract-text-webpack-plugin'); const HtmlWebpackPlugin = require('html-webpack-plugin'); const CopyWebpackPlugin = require('copy-webpack-plugin'); module.exports = { entry: { main: './index.js', vendor: ['react', 'react-dom'] }, output: { filename: 'static/js/[name].js', path: path.resolve(__dirname, 'dist'), publicPath: '/', }, context: path.resolve(__dirname, 'src'), module: { rules: [{ test: /\.js$/, use: ['babel-loader'], exclude: /node_modules/ }, { test: /\.css$/, use: ExtractTextPlugin.extract(['css-loader', 'postcss-loader']) }, { test: /\.(png|jpg|gif|svg)$/, use: ['file-loader?name=static/images/[name].[ext]'] } ], }, devtool: 'source-map', plugins: [ new webpack.optimize.CommonsChunkPlugin({ names: ['vendor'] }), new ExtractTextPlugin('static/css/[name].css'), new HtmlWebpackPlugin({ template: path.resolve(__dirname, 'public/index.html'), filename: 'index.html' }), new CopyWebpackPlugin([{ from: path.resolve(__dirname, 'public/favicon.ico') }]) ], performance: { hints: false } } if (process.env.NODE_ENV === 'production') { module.exports.plugins = (module.exports.plugins || []).concat([ new webpack.DefinePlugin({ 'process.env': { NODE_ENV: '"production"' } }), new webpack.optimize.UglifyJsPlugin({ sourceMap: true, compress: { warnings: false } }) ]) }
postcss.config.js
module.exports = { plugins: [ require("postcss-cssnext")() ] }
文件目录如下
看你的报错,你用的webpack2?webpack2 的 postcss 是咋配置的?
首先确定你的node版本,之前4.*的版本是不支持箭头函数的,需要改成
postcss: function () { return [ require('autoprefixer') ] }
然后检查你是否安装了你所用到的包,postcss,postcss-loader, autoprefixer
你应该是使用了默认安装的webpack@2.x ,配置和1.x不一样的。推荐使用LoaderOptionsPlugin
webpack@2.x
1.x
LoaderOptionsPlugin
new webpack.LoaderOptionsPlugin({ debug: false, options: { postcss: [ autoprefixer() ], }, })
参考文档webpack@2.x
微信扫码关注PHP中文网服务号
QQ扫码加入技术交流群
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
PHP学习
技术支持
返回顶部
一个完整的例子
webpack.config.js
postcss.config.js
文件目录如下
看你的报错,你用的webpack2?webpack2 的 postcss 是咋配置的?
首先确定你的node版本,之前4.*的版本是不支持箭头函数的,需要改成
然后检查你是否安装了你所用到的包,postcss,postcss-loader, autoprefixer
你应该是使用了默认安装的
webpack@2.x,配置和1.x不一样的。推荐使用LoaderOptionsPlugin参考文档webpack@2.x