首页
学习
活动
专区
圈层
工具
发布

13 个 npm 快速开发技巧

设置默认npm init属性 当运行npm init开始一个新项目时,你可能会发现自己一次又一次地输入配置细节。假如,你可能是项目的主要负责人。...如果你只处理特定的项目,那么这不是问题,但是在许多情况下,跨平台兼容性很有必要的:任何开放源码或协作项目,以及示例和教程项目,都应该能够工作,而不管操作系统是什么。 谢天谢地,解决方案很简单。...如果你的项目已经连接到远程存储库,并且已经在命令行上安装了git,那您可以使用这个命令找到你的连接存储库 git config --get remote.origin.url 更好的是,如果你按照上面的提示并安装了...自定义npm init脚本 让我们更进一步,使用我们自己的npm init脚本,它接受GitHub存储库URL并自动推送我们的第一个提交。在本技巧中,我们将讨论如何创建自定义npm init脚本。...为了确保npm init被指向正确的文件,可以运行: npm config set init-module ~\.npm-init.js 在集成git之前,这里有一个简单的.npm-init.js文件,

1.9K50
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    hexo搭建博客系统

    这次选择直接使用hexo做一个长期日常使用的博客系统 Hexo是什么 Hexo是基于nodejs的,那么我们需要知道nodejs是什么 node.js是一个运行在chromeJavascript运行环境下...) 安装完成后查看nodejs和其包管理器npm的版本 node -v npm -v ? 我们通过包管理器npm来安装hexo,但由于源是国外的访问很慢。...hexo使用 初始化博客目录 在本地创建一个目录比如blog作为博客项目工作区 在你选择的目录下执行初始化命令hexo init,在此之前如果你没有安装git那要先把git安装一下 F:\blog>hexo...也就是你刚刚创建的库 deploy: type: git repository: https://github.com/Jasper-zh/Jasper-zh.github.io.git branch...部署工具和部署配置都完成后就可以通过你的库名访问了,基本上呢没有什么问题。

    1K20

    【工程化】探索webpack5中的Module Federation

    简单粗暴-CV大法 直接将项目 A 的组件,copy 到项目 B 中,这样的方式有时候是比较快的,但也存在维护性极低的问题,后续两个项目都各自维护一套 抽象成 npm 我们可以将一些公共的模块抽象成 npm...,每个项目都去安装该 npm 包,从而达到共享的目的 但是 npm 包的方式存在以下问题: 编译与构建:一些公共的工具库,框架以及 UI 库存在重复构建,造成性能低下 版本更新:需要各个项目都去升级。...,除了上面提到的问题,还有 externals 没有按需加载 git submodule 子模块允许你将一个 Git 仓库作为另一个 Git 仓库的子目录。...git submodule update --recursive --remote :拉取所有子模块的更新 Module Federation 是什么?...runtime 做了大量改造,在运行时要做的事情也因此陡然增加,可能会对我们页面的运行时性能造成负面影响 4、 运行时共享也是一把双刃剑,如何去做版本控制以及控制共享模块的影响是需要去考虑的问题 对于问题

    2.4K20

    从零实现一套属于自己的UI框架-发布到npm

    需要技能 需要掌握 Vue 的基本语法 组件之间的通信 插槽的用法 vue-cli3 创建项目、打包 npm & git 的用法 创建项目 检查 node 环境配置 先本地全局安装node环境,vue的运行是依赖于...然后在我们本地创建的项目根目录执行git init,初始化git,然后再终端执行以下命令: git remote add origin git add ....git commit -am ":rocket: project init" git push -u origin master ?...大家有没有发现我提交的commit不一样,其实就是用到了gitmoji这个依赖而已,简单说下他的用法: 全局安装这个依赖 npm install -g gitmoji-cli commit 提交代码时...不管是面试还是自己公司内部需要搭建自己的UI库,只要小伙伴们掌握了封装组件的原理,其他的都问题不大。希望有需要的小伙伴手动敲一遍,加深对封装组件的过程。? ? 加油 完

    1.6K10

    2018 年了,你还是只会 npm install 吗?

    所指向的代码库满足条件 (a) git@github.com:webpack/webpack.git 2.2 安装本地包/远程git仓库包 上面表格的定义意味着,我们在共享依赖包时,并不是非要将包发表到...://isaacs@github.com/npm/npm.git git://github.com/npm/npm.git#v1.0.27 场景3: 开源 package 问题修复 使用某个 npm 包时发现它有某个严重...方案: 最好的办法应当是 fork 原作者的 git 库,在自己所属的 repo 下修复问题后,将 dependencies 中相应的依赖项更改为自己修复后版本的 git url 即可解决问题。...(Fork 代码库后,也便于向原作者提交 PR 修复问题。上游代码库修复问题后,再次更新我们的依赖配置也不迟。)...所以 webpack 和 nconf 的库代码中 require('async') 语句的执行都不会有任何问题。

    7K160

    【组件库封装】:封装一个 Library 什么流程?

    完整开发一个 Library,会涉及到以下几方面问题: 项目托管(Git 或 Svn,建议用 Git) JS包管理(npm 或 yarn,建议用 npm) 项目结构(monorepo 或 multirepo...文档(dumi、storybook、gitpages 等) 发布(npm publish) 本文将以开源项目 ReactRouter++ 为例,带大家一步步体会这个组件库的完整开发流程。...Create an organization scoped package: npm init --scope= ?...开发 本文着重讲解一个 library 库的整体研发路线,不深入组件开发细节。...文档 靠谱的开源软件必然需要靠谱的文档,vuepress、dumi、storybook 都是优秀的基于 Markdown 的快速建站工具。这些工具不仅能编写文档,还可以在线展示可运行的代码示例。 ?

    1.3K30

    这是学习Git 和 GitHub真正需要的

    1.1.2 人为维护文档版本的问题 文档数量多且命名不清晰导致文档版本混乱 每次编辑文档需要复制,不方便 多人同时编辑同一个文档,容易产生覆盖 1.2 Git 是什么 Git是一个版本管理控制系统(缩写...git 你是谁,在向 git 仓库中提交时需要用到。...使用场景:分支临时切换 存储临时改动:git stash 恢复改动:git stash pop 2.3 GIT忽略清单 将不需要被git管理的文件名字添加到此文件中,在执行git命令的时候,git就会忽略这些文件...拉取远程仓库中最新的版本:git pull 远程仓库地址 分支名称 3.5 解决冲突 在多人同时开发一个项目时,如果两个人修改了同一个文件的同一个地方,就会发生冲突。...生成秘钥:ssh-keygen 秘钥存储目录:C:\Users\用户\.ssh 公钥名称:id_rsa.pub 私钥名称:id_rsa gitHub其它用法 安装gulp npm install gulp

    1.2K30

    基于 Yarn WorkSpace + Lerna + OrangeCI 搭建 Typescript Monorepo 项目实践

    而在这次在迁移搭建全民 K 歌基础库的实践中,在诸如 Orange CI 自动发布 npm 包等问题上就遇到了不少阻碍,我们把经验总结记录如下。...Monorepo:一种管理组织代码的方式,其主要特点是多个项目的代码存储在同一个 git repo 中 Multirepo:一种管理组织代码的方式,其主要特点是多个项目的代码存储在不同 git repo...无代码使用文档 所以要更好管理基础库代码,从业务项目迁移基础库代码、独立发布 npm 包是解决问题的关键。...其实了解 Lerna 用法的同学都知道,这里只用 Lerna 的命令lerna bootstrap可以完美的解决这个问题,但在这里,我使用 Yarn workSpace 代替 npm,除了保证 package...--yes:运行 lerna version、lerna publish 将跳过所有确认提示 临时发布 npm 包 当开发者开发基础库时,需要在业务测试该 package,但不能以 release 的版本号发布

    4.3K42

    应用软件开发的工程化-JavaScript

    & npm init -y npm install express cat > app.js <<EOF const express = require('express'); const app...它提供了丰富的规则,可以帮助开发者检查代码中的错误和潜在问题。 Prettier:代码格式化工具。它可以自动格式化代码,使其符合特定的代码风格。 Husky:Git 钩子工具。...该镜像将使用 Alpine Linux 作为基础操作系统,并安装应用程序的依赖项。容器启动时将运行 node index.js 命令来启动应用程序,并公开应用程序的端口 80。...REPO: Onwalk 制品存储库的名称。 IMAGE: 要构建的 Docker 镜像的名称。 TAG: 要分配给 Docker 镜像的标签。...如需在自己的账号运行这个Demo,只需要将 https://github.com/scaffolding-design/javascript.git 这个仓库Fork 到你自己的Github账号下,同时在

    81550

    Angular CLI 使用教程指南参考

    安装 要安装Angular CLI你需要先安装node和npm,然后运行以下命令来安装最新的Angular CLI: 注意:Angular CLI 需要Node 4.X 和 NPM 3.X 以上的版本支持...输出详细信息 --skip-npm 在项目第一次创建时不执行任何npm命令 --name 指定创建项目的名称 ng serve ng new PROJECT_NAME cd PROJECT_NAME...init [options] 在当前所在目录下初始化一个新的 Angular 项目 参数 描述 --dry-run -d 只输出要创建的文件和执行的操作,实际上并没有创建项目...--verbose -v 输出详细信息 --skip-npm 在项目第一次创建时不执行任何npm命令 --name 指定创建项目的名称 ng completion 命令 描述 ng completion...build --dev ng build ng github-pages:deploy 命令 描述 ng github-pages:deploy [options] 构建生产应用程序,设置GitHub存储库

    4.2K50

    npm 全面介绍

    为什么要使用 NPM npm 是随同 Node.js 一起安装的包管理工具,能解决 Node.js 代码部署上的很多问题,常见的场景有以下几种: 允许用户从 npm 服务器下载别人编写的第三方包到本地使用...npm 的背后,是基于 couchdb 的一个数据库,详细记录了每个包的信息,包括作者、版本、依赖、授权信息等。...# 查看 npm 命令列表 $ npm help # 查看各个命令的简单用法 $ npm -l # 查看 npm 的版本 $ npm -v # 查看 npm 的配置 $ npm config list...-l 使用 npm init npm init 用来初始化生成一个新的 package.json 文件。...npm init 设置了默认值,以后执行 npm init 的时候,package.json 的作者姓名、邮件、主页、许可证字段就会自动写入预设的值。

    1.8K30

    理解Git Submodules

    试点、Node项目中的纯前端部分、Electron项目中的UI部分等等 某个模块是黑盒依赖项,开发中仅依赖其构建后的版本,比如框架类库等 针对诸如此类的情况,一般有3种解决方案: npm package...:把依赖项拆出去作为npm package,代码库随之独立出去 monorepo:单repo体积庞大没关系,分模块管理好就行 git submodules:把依赖项拆分到多个独立repo,作为主repo...: 主项目:调不通啊 子模块:有点问题,我改一下...改版本号-构建-发布npm package 主项目:更新依赖,再试...还是调不通啊 子模块:还有点问题......submodule update --init 也可以在clone主repo时,通过--recursive选项也能完成上面两步工作: $ git clone git://gihub.com/path-to....关于submodules的更多用法,见7.11 Git Tools – Submodules 四.常见问题 子模块分支处于detached状态 每次执行git submodule update --remote

    2.9K71

    NPM 学习笔记整理

    为什么要使用 NPM npm 是随同 Node 一起安装的包管理工具,能解决 Node 代码部署上的很多问题,常见的场景有以下几种: 允许用户从 npm 服务器下载别人编写的第三方包到本地使用。...npm 的背后,是基于 CouchDB 的一个数据库,详细记录了每个包的信息,包括作者、版本、依赖、授权信息等。...# 查看 npm 命令列表 $ npm help # 查看各个命令的简单用法 $ npm -l # 查看 npm 的版本 $ npm -v # 查看 npm 的配置 $ npm config list...-l 使用 npm init npm init 用来初始化生成一个新的 package.json 文件。...npm init 设置了默认值,以后执行 npm init 的时候,package.json的作者姓名、邮件、主页、许可证字段就会自动写入预设的值。

    91900
    领券