NestJs和Vite使用monorepo管理项目中,需要使用共享的文件夹步骤

NestJsVite使用monorepo管理项目中,需要使用共享的文件夹步骤

1 首先需要将nest-cli打包的功能通过webpack接管

nest-cli.json文件内容

json 复制代码
{
  "$schema": "https://json.schemastore.org/nest-cli",
  "collection": "@nestjs/schematics",
  "sourceRoot": "src",
  "compilerOptions": {
    "webpack": true,
    "deleteOutDir": true,
    "tsConfigPath": "./tsconfig.build.json"
  }
}

根目录创建webpack.config.js文件. 使用nest-cli创建项目时, 已经安装了webpack的基本模块,因此可以直接使用

文件内容, 就按照下面的内容进行修改即可

js 复制代码
const path = require("path")
const webpack = require("webpack")
const CopyPlugin = require("copy-webpack-plugin")

const sharedDirPath = path.resolve(__dirname, "../shared")
module.exports = {
  entry: "./src/main.ts",
  watch: true,
  target: "node",
  module: {
    rules: [
      {
        test: /\.ts?$/,
        use: "ts-loader",
        exclude: /node_modules/
      }
    ]
  },
  mode: "development",
  resolve: {
    extensions: [".tsx", ".ts", ".js"],
    alias: {
      "@shared": sharedDirPath
    }
  },
  plugins: [
    new webpack.HotModuleReplacementPlugin(),
    new CopyPlugin({
      patterns: [
        {
          from: sharedDirPath,
          to: "shared"
        }
      ]
    })
  ],
  output: {
    path: path.join(__dirname, "dist"),
    filename: "main.js"
  }
}

注意copy-webpack-plugin的版本需要指定, 这里webpack的版本是5.73.0安装copy-webpack-plugin@9.1.0即可
pnpm add copy-webpack-plugin@9.1.0 -D, 不然会出现奇奇怪怪的问题

相关推荐
徐小夕@趣谈前端1 小时前
NO-CRM 2.0正式上线,Vue3+Echarts+NestJS实现的全栈CRM系统,用AI重新定义和实现客户管理系统
前端·javascript·人工智能·开源·编辑器·echarts
catino1 小时前
图片、文件上传
前端
Mr Xu_2 小时前
Vue3 + Element Plus 实现点击导航平滑滚动到页面指定位置
前端·javascript·vue.js
小王努力学编程2 小时前
LangChain——AI应用开发框架(核心组件1)
linux·服务器·前端·数据库·c++·人工智能·langchain
pas1362 小时前
35-mini-vue 实现组件更新功能
前端·javascript·vue.js
前端达人2 小时前
为什么聪明的工程师都在用TypeScript写AI辅助代码?
前端·javascript·人工智能·typescript·ecmascript
快乐点吧2 小时前
使用 data-属性和 CSS 属性选择器实现状态样式控制
前端·css
EndingCoder3 小时前
属性和参数装饰器
java·linux·前端·ubuntu·typescript
小二·3 小时前
Python Web 开发进阶实战:量子机器学习实验平台 —— 在 Flask + Vue 中集成 Qiskit 构建混合量子-经典 AI 应用
前端·人工智能·python
TTGGGFF3 小时前
控制系统建模仿真(十):实战篇——从工具掌握到工程化落地
前端·javascript·ajax