Skip to content

Commit

Permalink
refactor: remove subpath package for types
Browse files Browse the repository at this point in the history
  • Loading branch information
DarrenDanielDay committed Sep 22, 2022
1 parent d1966e0 commit 0f6cbe6
Show file tree
Hide file tree
Showing 4 changed files with 18 additions and 6 deletions.
15 changes: 12 additions & 3 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -36,12 +36,22 @@ npm install func-di # or other package manager
Or no tool chain:

```html
<!-- use import map to make alias for `react` -->
<script type="importmap">
{
"imports": {
"react": "https://unpkg.com/es-react"
}
}
</script>
<script type="module">
import { token, inject, container } from "https://unpkg.com/func-di"; // or other CDN URL
// Support ES module out of the box
</script>
```

If want to use React support in browser directly without `Node.JS` tool chain, add the following code before all script elements in your HTML. Note that `<script type="importmap">` is not currently supported in every modern browser (e.g. `FireFox`, `Safari`). You might need this tool: <https://github.com/guybedford/es-module-shims> for those browsers.

## Usage

See test cases for more details.
Expand Down Expand Up @@ -170,7 +180,7 @@ Using `Provide` will create a nested component. It has only one `IoCContext.Prov
// Relevant dependency declarations and implementations
import React from "react";
import ReactDOM from "react-dom/client";
import { Inject, Provide } from "func-di/react";
import { Inject, Provide } from "func-di";
interface CountService {
count: number;
}
Expand Down Expand Up @@ -223,8 +233,7 @@ You can also use these hooks directly inside react components to get injected de

```tsx
// Some of the same code as above has been omitted.
import { useInjection } from 'func-di/hooks';
import { connectInjectionHooks } from 'func-di/react';
import { useInjection, connectInjectionHooks } from 'func-di';
const Component: React.FC = () => {
const { count } = useInjection(countService);
return (
Expand Down
5 changes: 2 additions & 3 deletions README.zh-CN.md
Original file line number Diff line number Diff line change
Expand Up @@ -171,7 +171,7 @@ const dependencyB = token("ServiceB");
// 相关的依赖声明与实现
import React from "react";
import ReactDOM from "react-dom/client";
import { Inject, Provide } from "func-di/react";
import { Inject, Provide } from "func-di";
interface CountService {
count: number;
}
Expand Down Expand Up @@ -224,8 +224,7 @@ ReactDOM.createRoot(document.querySelector("#root")!).render(

```tsx
// 部分与上文相同的代码已被省略。
import { useInjection } from "func-di/hooks";
import { connectInjectionHooks } from "func-di/react";
import { useInjection, connectInjectionHooks } from 'func-di';
const Component: React.FC = () => {
const { count } = useInjection(countService);
return (
Expand Down
1 change: 1 addition & 0 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,7 @@
"description": "A functional, immutable, type safe and simple dependency injection library inspired by angular.",
"main": "dist/index.js",
"type": "module",
"sideEffects": false,
"scripts": {
"build": "ts-esmbuilder",
"format": "prettier --write .",
Expand Down
3 changes: 3 additions & 0 deletions src/index.ts
Original file line number Diff line number Diff line change
Expand Up @@ -3,3 +3,6 @@ export * from "./consumer";
export * from "./container";
export * from "./inject";
export * from "./token";
// TODO: Remove exports in main entry and use subpath.
export * from "./hooks";
export * from "./react";

0 comments on commit 0f6cbe6

Please sign in to comment.