Share the same vue library between core and features

This commit is contained in:
timongh 2023-07-23 23:37:09 +08:00
parent e13a7498ba
commit 282d88128a
6 changed files with 18 additions and 2 deletions

View File

@ -155,7 +155,7 @@ pnpm install
### 全局
全局变量, 无需 `import` 就可以直接使用. (Tampermonkey API 这里不再列出了, 可根据代码提示使用)
- `Vue`: Vue 2 提供的主要对象. 不再推荐使用. 项目正处于 Vue 2.7 到 Vue 3 的过渡阶段, 建议优先使用组合式 API. 如果需要以选项式方式定义 Vue 组件, 请使用 `defineComponent` 而非 `Vue.extend``new Vue`.
- `Vue`: Vue 2 提供的主要对象. 不再推荐使用. 如果需要以选项式方式定义 Vue 组件, 请使用 `defineComponent` 而非 `Vue.extend``new Vue`.
- `lodash`: 包含所有 Lodash 库提供的方法
- `dq` / `dqa`: `document.querySelector``document.querySelectorAll` 的简写, `dqa` 会返回真实数组
> 在 `bwp-video` 出现后, 这两个查询函数还会自动将对 `video` 的查询扩展到 `bwp-video`

View File

@ -34,6 +34,8 @@ export const buildByEntry = (params: {
},
cache: false,
externals: [
// see src/client/init-vue.ts
{ vue: 'global Vue' },
...(defaultConfig.externals as any[]),
({ request }, callback) => {
const regexMatch = (regex: RegExp, base: string[]) => {

View File

@ -1,7 +1,15 @@
import { default as VueLibrary } from 'vue'
export const initVue = () => {
// # 在 core 和 features 中使用同一个 Vue 库的实现方式
//
// 1. 在 core 中使用 commonjs 版本的 vue。通过配置 webpack/webpack.dev.ts, webpack/webpack.prod.ts 完成
// 2. 将 `window.Vue` 设置为 'vue' 模块的默认导出。在 src/client/init-vue.ts 中完成
// 3. 在 registry 中将 'vue' 设置为外部依赖,来源为 `window.Vue`。在 registry/webpack/config.ts 中完成
//
// 使用 commonjs 版本的原因:为了使 `window.Vue` 同时包含 Vue 2.7 提供的具名导出 API。https://v2.vuejs.org/v2/guide/migration-vue-2-7.html#Notes-on-API-exposure
window.Vue = VueLibrary
Vue.config.devtools = false
Vue.config.productionTip = false
Vue.directive('hit', {

View File

@ -27,7 +27,6 @@ export const getDefaultConfig = (src = relativePath('src')): Configuration => {
alias: {
'@': relativePath('src'),
'fuse.js$': 'fuse.js/dist/fuse.basic.esm.min.js',
vue$: 'vue/dist/vue.esm.js',
},
},
performance: {

View File

@ -1,3 +1,4 @@
import lodash from 'lodash'
import webpack, { Configuration } from 'webpack'
import { getBanner, getDefaultConfig } from './webpack.config'
import previewMeta from '../src/client/bilibili-evolved.preview.meta.json'
@ -16,4 +17,7 @@ previewConfig.plugins.push(
}),
)
// see src/client/init-vue.ts
lodash.set(previewConfig, 'resolve.alias.vue$', 'vue/dist/vue.common.prod.js')
export default previewConfig

View File

@ -26,4 +26,7 @@ const targets = [mainConfig, previewConfig].map(config => {
return config
})
// see src/client/init-vue.ts
lodash.set(previewConfig, 'resolve.alias.vue$', 'vue/dist/vue.common.prod.js')
export default targets