学习来源:抖音“哲玄前端”《大前端全栈实践》
npm包:
包名:@yuan-1211/elpis
简介:一个企业级全栈应用框架
引用:npm i @yuan-1211/elpis
提前说明
elpis 为npm包源项目
elpis-system 为引用npm包项目
准备工作
我们需要本地将 elpis 作为一个npm包使用,所以需要进行 npm link 软链接
elpis ->项目name:'@yuan-1211/elpis' -> npm link 创建软连接
elpis-system ->npm link @yuan-1211/elpis 链接elpis
elpis 抽离
注意:进行每次抽离操作后都需要进行验证,不然很难找出问题点。
(一)将项目内需要暴露出去的方法进行module.exports导出
例如: 主文件/前端工程化 webpack 启动文件,组件等等
举例:
将项目运行方法 使用 module.exports ={start()} 导出
,elpis-system 使用 const {serverStart} = require('@yuan-1211/elpis')
(二) 处理文件应用路径问题
elpis 引用自身文件和依赖 使用path.reslove(自身文件),require.resolve(依赖)处理
举例
webapck.base.js 中
-
配置多个解析loader,loader路径查找方式为引用这当前项目的根目往下查找,我们要将路径指向elpis下。所以将loader的path 使用
require.reslove('xxx-loader') -
reslove=>alias 设置别名:
地址在 elpis 内: path.resolve(__dirname,基于__dirname的文件路径.js)
地址在 elpis-system 内: path:path.reslove(process.cwd(),'./app/**/**.js') fs.existsSync(filepath)判断是否有此文件
中间件中
-
elpis 读取自身***.js
path.reslove(__dirname, 基于__dirname的文件路径.js) -
elpis 读取 elpis-system ***.js
path.resolve(process.cwd,'./app/**/**.js')
(三) 清除多余业务文件
清除elpis中多余业务文件。
npm包发布流程
设置npm 源 npm config set registry
登录 npm login
登录成功后验证 npm whoami
将包发成公共包
第一次 :npm publish --access public
以后:npm publish