我们的新项目是基于vite+vue3的，使用的编程语言是JavaScript。我们的团队除了我，对typescript都不熟悉，他们觉得学习typescript有点困难。众所周知，JS的弱类型机制，使编辑器很难提供更好的智能感知和语法提示。那么，怎么办呢？在过去，我通常单独使用jsdoc。但这次，我想做一个不同的尝试，使用TS类型定义和jsdoc协作。我们只需在项目根目录创建一个jsconfig.json文件即可，基本配置如下。我们的项目中使用了element-plus组件库，为了提供更好的智能感知，我添加了element-plus的TS类型定义到compilerOptions的types数组
我们的新项目是基于vite+vue3的，使用的编程语言是JavaScript。我们的团队除了我，对typescript都不熟悉，他们觉得学习typescript有点困难。众所周知，JS的弱类型机制，使编辑器很难提供更好的智能感知和语法提示。那么，怎么办呢？在过去，我通常单独使用jsdoc。但这次，我想做一个不同的尝试，使用TS类型定义和jsdoc协作。我们只需在项目根目录创建一个jsconfig.json文件即可，基本配置如下。我们的项目中使用了element-plus组件库，为了提供更好的智能感知，我添加了element-plus的TS类型定义到compilerOptions的types数组
随着项目的日渐迭代，项目整体的代码量也会越来越多，从而导致项目体积越来越大；在Webpack时代，很多人会对历史项目（巨型项目）感到头疼，因为往往巨型项目在本地开发调试的时候会因为本地代码的修改触发HMR热更新重载页面，然而这一过程在Webpack的运行机制中显得很慢，并且是随着项目越大，热更新的速度也会越慢； Webpack热更新慢的问题可以通过 babel-plugin-dynamic-import-node 插件来得到明显改善，或者通过手动实现动态按需加载（修改entry为当前项目中需要编译的部分或模块）亦可大幅提升热更新速度； 热更新构建主要流程 在Webpack中
随着项目的日渐迭代，项目整体的代码量也会越来越多，从而导致项目体积越来越大；在Webpack时代，很多人会对历史项目（巨型项目）感到头疼，因为往往巨型项目在本地开发调试的时候会因为本地代码的修改触发HMR热更新重载页面，然而这一过程在Webpack的运行机制中显得很慢，并且是随着项目越大，热更新的速度也会越慢； Webpack热更新慢的问题可以通过 babel-plugin-dynamic-import-node 插件来得到明显改善，或者通过手动实现动态按需加载（修改entry为当前项目中需要编译的部分或模块）亦可大幅提升热更新速度； 热更新构建主要流程 在Webpack中
博客园@四季留歌项目工程下载（腾讯微云）：点我目录项目工程下载（腾讯微云）：点我安装依赖安装vite插件配置cdn插件vite-plugin-html-config插件vite-plugin-compression插件vite-plugin-externals细说CesiumCDN部署的一个问题CESIUM_BASE_URL推荐改进缺点：必须安装cesium依赖和几个vite插件，起项目时略微麻烦，部署cdn较麻烦优点：打包速度起飞，构建后的成果代码网络传输效率最佳安装依赖yarnaddcesium#这个是给开发时vite的esbuild找模块用的yarnadd@types/cesium-D#
博客园@四季留歌项目工程下载（腾讯微云）：点我目录项目工程下载（腾讯微云）：点我安装依赖安装vite插件配置cdn插件vite-plugin-html-config插件vite-plugin-compression插件vite-plugin-externals细说CesiumCDN部署的一个问题CESIUM_BASE_URL推荐改进缺点：必须安装cesium依赖和几个vite插件，起项目时略微麻烦，部署cdn较麻烦优点：打包速度起飞，构建后的成果代码网络传输效率最佳安装依赖yarnaddcesium#这个是给开发时vite的esbuild找模块用的yarnadd@types/cesium-D#
一，搭建vite项目 兼容性注意：Vite需要 Node.js 版本14.18+，16+。然而，有些模板需要依赖更高的Node版本才能正常运行，当你的包管理器发出警告时，请注意升级你的Node版本。 通过下面的命令行可以创建指定项目名称和你想要使用的模板的vue项目#npm6.xnpmcreatevite@latestmy-vue-app--templatevue#npm7+,extradouble-dashisneeded:npmcreatevite@latestmy-vue-app----templatevue#yarnyarncreatevitemy-vue-app--templat
一，搭建vite项目 兼容性注意：Vite需要 Node.js 版本14.18+，16+。然而，有些模板需要依赖更高的Node版本才能正常运行，当你的包管理器发出警告时，请注意升级你的Node版本。 通过下面的命令行可以创建指定项目名称和你想要使用的模板的vue项目#npm6.xnpmcreatevite@latestmy-vue-app--templatevue#npm7+,extradouble-dashisneeded:npmcreatevite@latestmy-vue-app----templatevue#yarnyarncreatevitemy-vue-app--templat
vite最近非常火，它是vue作者尤大神发布前端构建工具，底层基于Rollup，无论是启动速度还是热加载速度都非常快。vite随vue3正式版一起发布，刚开始的时候与vue绑定在一起，但之后的v2版本便比较独立，vite不仅支持vue，还支持React、Preact、Vanilla等前端库。由于vite出现的时间不是很久，基于vite创建的项目没有vue-cli那么完整，如果要使用vue全家桶、ESLint等，还需要开发人员手动添加和配置，步骤稍多，略繁琐。虽然在创建项目时可以选择Customizewithcreate-vue，但我由于网络问题，一直没有成功过。所以我封装了一个cli用于快速创
vite最近非常火，它是vue作者尤大神发布前端构建工具，底层基于Rollup，无论是启动速度还是热加载速度都非常快。vite随vue3正式版一起发布，刚开始的时候与vue绑定在一起，但之后的v2版本便比较独立，vite不仅支持vue，还支持React、Preact、Vanilla等前端库。由于vite出现的时间不是很久，基于vite创建的项目没有vue-cli那么完整，如果要使用vue全家桶、ESLint等，还需要开发人员手动添加和配置，步骤稍多，略繁琐。虽然在创建项目时可以选择Customizewithcreate-vue，但我由于网络问题，一直没有成功过。所以我封装了一个cli用于快速创
