服务端webpack的配置?

// webpack.server.js

const path = require('path')
const nodeExternals = require('webpack-node-externals')
module.exports = {
  target: 'node', // 确定打包的是服务端的代码
  mode: 'development',
  entry: './src/index.js', // 入口
  output: { // 打包的文件要放在哪里去
    filename: 'bundle.js', // 打包之后起的名字
    path: path.resolve(__dirname, 'build') // 打包过后将文件放在哪个目录下
  },
  externals: [nodeExternals()], // 依靠node_modules中的文件还需要引入这个包,避免打包警告
  module: { // 打包过程中配置的规则
    rules: [{
      test: /\.js?$/, // 检测以JS结尾的文件
      loader: 'babel-loader', // 语法的编译器 使用需要安装
      exclude: '/node_modules/', // 一些外部文件不需要编译
      options: { // 配置额外的配置项
        presets: ['react', 'stage-0', ['env', {
          targets: { // babel编译的时候会去兼容浏览器最后两个版本
            browsers: ['last 2 versions']
          }
        }]] // 使用babel-loader的时候,可以使用presets配置一些编译的规则 需要安装
      }
    }]
  }
}

执行 webpack --config webpack.server.js

//package.json

{
  "name": "react-server",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "start": "node ./build/bundle.js" // 执行上方命令生成的文件
  },
  "author": "",
  "license": "ISC",
  "dependencies": {
    "babel-core": "^6.26.3",
    "babel-loader": "^7.1.5",
    "babel-preset-env": "^1.7.0",
    "babel-preset-react": "^6.24.1",
    "babel-preset-stage-0": "^6.24.1",
    "express": "^4.17.1",
    "react": "^17.0.2",
    "webpack": "^5.64.4",
    "webpack-cli": "^4.9.1",
    "webpack-node-externals": "^3.0.0"
  },
  "devDependencies": {
    "@babel/preset-react": "^7.16.0"
  }
}

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值