山西网站开发建设,做家电网站,企业建设网站策划案,个人做地方民生网站背景#xff1a;本地环境对功能组件提取#xff0c;开发环境下通过本地路径引用#xff0c;发布模式下走npm包引用
1、项目下新建packages/HelloWorld文件夹#xff0c;在此文件夹下运行终端 npm init 新建packages/HelloWorld/index.vue文件 新建packages/HelloWorld/ind…背景本地环境对功能组件提取开发环境下通过本地路径引用发布模式下走npm包引用
1、项目下新建packages/HelloWorld文件夹在此文件夹下运行终端 npm init 新建packages/HelloWorld/index.vue文件 新建packages/HelloWorld/index.js文件
import helloworld from ./index.vue;export {helloworld
}
1、本地打包 npm pack 将helloworld-1.0.1.tgz 放到项目根目录下运行终端命令 npm install helloworld-1.0.1.tgz //加载组件 npm uninstall helloworld-1.0.1.tgz //删除组件 在项目.vue文件中引用
script setup
import {helloworld} from helloworld
/scripttemplatedivspan测试helloworld组件/spanhelloworld/helloworld/div
/template
2、私库打包 npm config get registry //查看 npm 配置私库地址 npm config set registry ${私库地址https://registry.npmjs.org/} //设置私库地址 npm adduser --registry ${私库地址https://registry.npmjs.org/} //添加用户 npm login //登录私库账号 npm publish //将npm包推送到私库 npm unpublish ${包名} --force //删除已发布的包 npm install ${包名} //下载对应包 3、本地路径访问
安装types/node配置src目录路径 npm install types/node --save-dev 在vite.config.ts文件添加配置 hello-world: resolve(__dirname, packages/HelloWorld) 在项目.vue文件中引用
