webpack中babel和postcss的使用

60 阅读1分钟

1.babel

npm i -D babel-loader @babel/preset-env @babel/core

webpack中的配置

module: {
    rules: [
      { test: /\.js$/, use: ["babel-loader"] },
    ],
  },

.babelrc.js的配置

module.exports = {
  // 预设
  presets: ["@babel/preset-env"],
};

2.postcss

npm i -D postcss postcss-cli postcss-preset-env postcss-loader

webpack中的配置

module: {
    rules: [
      {
        test: /\.css$/,
        use: ["vue-style-loader", "css-loader", "postcss-loader"],
      },
    ],
  },
  },

postcss.config.json的配置

module.exports = {
  plugins: [require("postcss-preset-env")],
};