Files
bodyshop/client/vite.config.js
Dave Richer 71663d64e4 - Updates
Signed-off-by: Dave Richer <dave@imexsystems.ca>
2024-01-18 11:43:57 -05:00

132 lines
4.4 KiB
JavaScript

import legacy from '@vitejs/plugin-legacy'
// import {createStyleImportPlugin} from 'vite-plugin-style-import'
import react from '@vitejs/plugin-react'
import {createRequire} from 'module';
import {defineConfig, transformWithEsbuild} from 'vite'
import {promises as fsPromises} from "fs";
import * as url from "url";
import * as path from "path";
import {nodePolyfills} from "vite-plugin-node-polyfills";
import {
AndDesignVueResolve,
AntdResolve,
createStyleImportPlugin,
ElementPlusResolve,
NutuiResolve,
VantResolve
} from "vite-plugin-style-import";
const WRONG_CODE = `import { bpfrpt_proptype_WindowScroller } from "../WindowScroller.js";`
function reactVirtualized() {
return {
name: 'flat:react-virtualized',
configResolved: async () => {
const require = createRequire(import.meta.url)
const reactVirtualizedPath = require.resolve('react-virtualized')
const {pathname: reactVirtualizedFilePath} = new url.URL(reactVirtualizedPath, import.meta.url)
const file = reactVirtualizedFilePath
.replace(
path.join('dist', 'commonjs', 'index.js'),
path.join('dist', 'es', 'WindowScroller', 'utils', 'onScroll.js'),
)
const code = await fsPromises.readFile(file, 'utf-8');
const modified = code.replace(WRONG_CODE, '')
await fsPromises.writeFile(file, modified)
},
}
}
export default defineConfig({
base: '/',
plugins: [
{
name: 'treat-js-files-as-jsx',
async transform(code, id) {
if (!id.match(/src\/.*\.js$/)) return null
return transformWithEsbuild(code, id, {
loader: 'jsx',
jsx: 'automatic',
})
},
},
// reactVirtualized(),
react({
// jsxImportSource: '@emotion/react',
// babel: {
// plugins: ['@emotion/babel-plugin'],
// },
}),
nodePolyfills({
protocolImports: true,
overrides: {
// Since `fs` is not supported in browsers, we can use the `memfs` package to polyfill it.
fs: 'memfs',
// Since `path` is not supported in browsers, we can use the `path-browserify` package to polyfill it.
path: 'path-browserify',
// Since `os` is not supported in browsers, we can use the `os-browserify` package to polyfill it.
os: 'os-browserify/browser',
// Since `crypto` is not supported in browsers, we can use the `crypto-browserify` package to polyfill it.
crypto: 'crypto-browserify',
// Since `stream` is not supported in browsers, we can use the `stream-browserify` package to polyfill it.
stream: 'stream-browserify',
// Since `buffer` is not supported in browsers, we can use the `buffer` package to polyfill it.
}
}),
createStyleImportPlugin({
resolves: [
AndDesignVueResolve(),
VantResolve(),
ElementPlusResolve(),
NutuiResolve(),
AntdResolve(),
],
libs: [
{
libraryName: 'ant-design-vue',
esModule: true,
resolveStyle: (name) => {
return `ant-design-vue/es/${name}/style/index`
},
},
]
}),
legacy({
targets: ['defaults', 'not IE 11']
}),
],
css: {
preprocessorOptions: {
less: {
javascriptEnabled: true,
modifyVars: {
'@text-color': '#000000',
'@ease-in-out': 'cubic-bezier(0.7, 0.3, 0.1, 1)',
'@ease-out': 'cubic-bezier(0.7, 0.3, 0.1, 1)',
'@primary-color': '#1DA57A',
}
}
}
},
server: {
host: true,
port: 3000,
},
optimizeDeps: {
// force: true,
esbuildOptions: {
loader: {
'.js': 'jsx',
},
},
},
build: {
outDir: 'dist',
rollupOptions: {
external: ['antd'],
}
}
})