基于vite2.0的开发构建工具vited

vited

基于vite2.0开发/打包工具

特点

  • 无需编写vite.config
  • 默认支持react和 react hmr
  • 支持 typescript
  • 支持spa/mpa 构建

安装

npm / yarn 安装:

$ npm install --save-dev vited
$ yarn add -D vited
复制代码
  -e, --entry <dir>  src目录下的入口目录/文件(不带扩展名)
  -b, --build         打包编译到dist目录
  -p --public-path    设置publicPath, 默认 /
复制代码

自动安装的vite依赖

  "devDependencies": {
    "@vitejs/plugin-react-refresh": "^1.3.2",
    "vite": "^2.3.0",
    "vite-plugin-style-import": "^0.10.0"
  },
复制代码
开发
vited -e dir/file
复制代码

设置开发端口

给package.json添加port属性 , 默认端口9004

{
  "name": "name",
  "version": "1.0.0",
  "scripts": {},
  "port":3000
}

复制代码
打包
vited -be dir/file

// 设置publicPath
vited -be dir/file -p https://www.xxx.com/
复制代码

项目根目录自定义 html 模板 index.ejs (可选),下列是默认模板 ,<%=entry%> 是入口路径

<!DOCTYPE html>
<html lang="zh-cn">
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta
      name="viewport"
      content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no,minimal-ui,viewport-fit=cover"
    />
    <meta name="format-detection" content="telephone=no, email=no" />
    <meta name="apple-mobile-web-app-capable" content="yes" />
    <meta name="apple-touch-fullscreen" content="yes" />
    <title></title>
  </head>
  <body style="font-size: 14px">
    <div id="root"></div>
    <script type="module" src="<%=entry%>"></script>
  </body>
</html>


复制代码
© 版权声明
THE END
喜欢就支持一下吧
点赞0 分享