Skip to content

Commit 22d5766

Browse files
authored
feat: monorepo structure (#213)
* WIP: start monorepo structuring * add packages * shared: add unit test * shared: update readme * compiler: move to compiler package * add fixpack script * update packages * update vue-i18n package * update * fix rollup config * fix benchmark * fix: type test * tweak build parallelization * fix: build type script * update docs * remove old codes * add packages
1 parent 1861d2d commit 22d5766

File tree

225 files changed

+2450
-1915
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

225 files changed

+2450
-1915
lines changed

.eslintignore

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
./dist
1+
dist
22
./jest.config.js
33
./jest.e2e.config.js
44
./api-extractor.json

.fixpackrc

+31
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,31 @@
1+
{
2+
"sortToTop": [
3+
"name",
4+
"version",
5+
"description",
6+
"keywords",
7+
"license",
8+
"author",
9+
"homepage",
10+
"repository",
11+
"bugs",
12+
"files",
13+
"directories",
14+
"bin",
15+
"main",
16+
"module",
17+
"browser",
18+
"module",
19+
"unpkg",
20+
"jsdelivr",
21+
"types",
22+
"scripts",
23+
"dependencies",
24+
"devDependencies",
25+
"peerDependencies",
26+
"bundledDependencies",
27+
"optionalDependencies",
28+
"engines",
29+
"private"
30+
]
31+
}

.github/CONTRIBUTING.md

+83-19
Original file line numberDiff line numberDiff line change
@@ -86,32 +86,57 @@ A high level overview of tools used:
8686

8787
### `yarn build`
8888

89-
The `build` script builds all build formats.
89+
The `build` script builds all public packages (packages without `private: true` in their `package.json`).
90+
91+
Packages to build can be specified with fuzzy matching:
92+
93+
```bash
94+
# build compiler only
95+
yarn build compiler
96+
97+
# build all packages
98+
yarn build --all
99+
```
90100

91101
#### Build Formats
92102

93-
- **`global`**:
103+
By default, each package will be built in multiple distribution formats as specified in the `buildOptions.formats` field in its `package.json`. These can be overwritten via the `-f` flag. The following formats are supported:
104+
105+
- **`global`**
94106

95107
- For direct use via `<script>` in the browser.
96108
- Note: global builds are not [UMD](https://github.com/umdjs/umd) builds. Instead they are built as [IIFEs](https://developer.mozilla.org/en-US/docs/Glossary/IIFE).
97109

98-
- **`esm-bundler`**:
110+
- **`esm-bundler`**
99111

100112
- Leaves prod/dev branches with `process.env.NODE_ENV` guards (to be replaced by bundler)
101113
- Does not ship a minified build (to be done together with the rest of the code after bundling)
102114
- For use with bundlers like `webpack`, `rollup` and `parcel`.
103115

104-
- **`esm-browser`**:
116+
- **`esm-browser`**
105117

106118
- For usage via native ES modules imports (in browser via `<script type="module">`, or via Node.js native ES modules support in the future)
107119
- Inlines all dependencies - i.e. it's a single ES module with no imports from other files
108120
- This means you **must** import everything from this file and this file only to ensure you are getting the same instance of code.
109121
- Hard-coded prod/dev branches, and the prod build is pre-minified (you will have to use different paths/aliases for dev/prod)
110122

111-
- **`cjs`**:
123+
- **`cjs`**
124+
112125
- For use in Node.js server-side rendering via `require()`.
113126
- The dev/prod files are pre-built, but are dynamically required based on `process.env.NODE_ENV` in `index.js`, which is the default entry when you do `require('vue-i18n')`.
114127

128+
For example, to build `compiler` with the global build only:
129+
130+
```bash
131+
yarn build compiler -f global
132+
```
133+
134+
Multiple formats can be specified as a comma-separated list:
135+
136+
```bash
137+
yarn build compiler -f esm-browser,cjs
138+
```
139+
115140
#### Build with Source Maps
116141

117142
Use the `--sourcemap` or `-s` flag to build with source maps. Note this will make the build much slower.
@@ -120,34 +145,73 @@ Use the `--sourcemap` or `-s` flag to build with source maps. Note this will mak
120145

121146
The `--types` or `-t` flag will generate type declarations during the build and in addition:
122147

123-
- Roll the declarations into a single `.d.ts` file.
124-
- Generate an API report in `<projectRoot>/temp/vue-i18n.api.md`. This report contains potential warnings emitted by [api-extractor](https://api-extractor.com/).
125-
- Generate an API model json in `<projectRoot>/temp/vue-i18n.api.json`. This file can be used to generate a Markdown version of the exported APIs.
148+
- Roll the declarations into a single `.d.ts` file for each package;
149+
- Generate an API report in `<projectRoot>/temp/<packageName>.api.md`. This report contains potential warnings emitted by [api-extractor](https://api-extractor.com/).
150+
- Generate an API model json in `<projectRoot>/temp/<packageName>.api.json`. This file can be used to generate a Markdown version of the exported APIs.
151+
152+
### `yarn dev`
153+
154+
The `dev` script bundles a target package (default: `vue-i18n`) in a specified format (default: `global`) in dev mode and watches for changes. This is useful when you want to load up a build in an HTML page for quick debugging:
155+
156+
```bash
157+
$ yarn dev
158+
159+
> rollup v1.19.4
160+
> bundles packages/vue-i18n/src/index.ts → packages/vue-i18n/dist/vue-i18n.global.js...
161+
```
162+
163+
- The `dev` script also supports fuzzy match for the target package, but will only match the first package matched.
164+
165+
- The `dev` script supports specifying build format via the `-f` flag just like the `build` script.
166+
167+
- The `dev` script also supports the `-s` flag for generating source maps, but it will make rebuilds slower.
126168

127169
### `yarn test`
128170

129-
The `yarn test` script simply calls the `jest` binary, so all [Jest CLI Options](https://jestjs.io/docs/en/cli) can be used. Some examples:
171+
The `test` script simply calls the `jest` binary, so all [Jest CLI Options](https://jestjs.io/docs/en/cli) can be used. Some examples:
130172

131173
```bash
132174
# run all tests
133175
$ yarn test
134176

135-
# run unit tests
136-
$ yarn test:unit
177+
# run tests in watch mode
178+
$ yarn test --watch
137179

138-
# run unit test coverages
139-
$ yarn test:coverage
180+
# run all tests under the runtime-core package
181+
$ yarn test compiler
140182

141-
# run unit tests in watch mode
142-
$ yarn test:watch
183+
# run tests in a specific file
184+
$ yarn test fileName
143185

144-
# run type tests
145-
$ yarn test:type
186+
# run a specific test in a specific file
187+
$ yarn test fileName -t 'test name'
188+
```
189+
190+
## Project Structure
191+
192+
This repository employs a [monorepo](https://en.wikipedia.org/wiki/Monorepo) setup which hosts a number of associated packages under the `packages` directory:
193+
194+
- `shared`: Internal utilities shared across multiple packages.
195+
- `message-resolver`: The message resolver.
196+
- `message-compiler`: The message format compiler.
197+
- `runtime`: The intlify runtime
198+
- `core`: The intlify core.
199+
- `vue-i18n`: The public facing "full build" which includes both the runtime AND the compiler.
146200

147-
# run e2e tests
148-
$ yarn test:e2e
201+
### Importing Packages
202+
203+
The packages can import each other directly using their package names. Note that when importing a package, the name listed in its `package.json` should be used. Most of the time the `@intlify/` prefix is needed:
204+
205+
```js
206+
import { baseCompile } from '@intlify/compiler'
149207
```
150208

209+
This is made possible via several configurations:
210+
211+
- For TypeScript, `compilerOptions.path` in `tsconfig.json`
212+
- For Jest, `moduleNameMapper` in `jest.config.js`
213+
- For plain Node.js, they are linked using [Yarn Workspaces](https://yarnpkg.com/blog/2017/08/02/introducing-workspaces/).
214+
151215
## Contributing Tests
152216

153217
Unit tests are collocated with directories named `test`. Consult the [Jest docs](https://jestjs.io/docs/en/using-matchers) and existing test cases for how to write new test specs. Here are some additional guidelines:

.github/workflows/test.yml

+2
Original file line numberDiff line numberDiff line change
@@ -37,6 +37,8 @@ jobs:
3737
${{ runner.os }}-yarn-
3838
- name: Install
3939
run: yarn install
40+
- name: Test
41+
run: yarn build --all -t
4042
- name: Test
4143
run: yarn test
4244
# https://github.com/actions/runner/issues/795

.textlintrc.js

+2-1
Original file line numberDiff line numberDiff line change
@@ -30,7 +30,8 @@ module.exports = {
3030
'CLI',
3131
'SFC',
3232
'PHP',
33-
'SSR'
33+
'SSR',
34+
'MIT'
3435
]
3536
},
3637
'abbr-within-parentheses': true,

.vscode/settings.json

+2-1
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
{
22
"files.associations": {
3-
"*.json": "jsonc"
3+
"*.json": "jsonc",
4+
".fixpackrc": "json"
45
},
56
"typescript.tsdk": "node_modules/typescript/lib"
67
}

README.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -53,7 +53,7 @@ The examples are offered in thee following two API styles:
5353

5454
## :white_check_mark: Tasks for release
5555

56-
- [ ] monorepo packaging
56+
- [x] monorepo packaging
5757
- [ ] support fully univarsal environments (CSP)
5858
- [ ] support i18n resources packing (pre-compilation) CLI
5959
- [ ] vue-cli-plugin-i18n

api-extractor.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -45,7 +45,7 @@
4545
*
4646
* SUPPORTED TOKENS: <projectFolder>, <packageName>, <unscopedPackageName>
4747
*/
48-
"mainEntryPointFilePath": "<projectFolder>/types/index.d.ts",
48+
// "mainEntryPointFilePath": "<projectFolder>/types/index.d.ts",
4949

5050
/**
5151
* A list of NPM package names whose exports should be treated as part of this package.

benchmark/complex.js

+9-5
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,14 @@
11
const {
2-
baseCompile,
2+
baseCompile
3+
} = require('../packages/message-compiler/dist/message-compiler.cjs.prod.js')
4+
const {
5+
clearCompileCache
6+
} = require('../packages/runtime/dist/runtime.cjs.prod.js')
7+
const {
38
translate,
4-
createRuntimeContext,
5-
clearCompileCache,
6-
createI18n
7-
} = require('../dist/vue-i18n.cjs.prod')
9+
createRuntimeContext
10+
} = require('../packages/core/dist/core.cjs.prod.js')
11+
const { createI18n } = require('../packages/vue-i18n/dist/vue-i18n.cjs.prod.js')
812
const convertHrtime = require('convert-hrtime')
913

1014
const data = require('./complex.json')

benchmark/simple.js

+9-5
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,14 @@
11
const {
2-
baseCompile,
2+
baseCompile
3+
} = require('../packages/message-compiler/dist/message-compiler.cjs.prod.js')
4+
const {
5+
clearCompileCache
6+
} = require('../packages/runtime/dist/runtime.cjs.prod.js')
7+
const {
38
translate,
4-
createRuntimeContext,
5-
clearCompileCache,
6-
createI18n
7-
} = require('../dist/vue-i18n.cjs.prod')
9+
createRuntimeContext
10+
} = require('../packages/core/dist/core.cjs.prod.js')
11+
const { createI18n } = require('../packages/vue-i18n/dist/vue-i18n.cjs.prod.js')
812
const convertHrtime = require('convert-hrtime')
913

1014
const simpleData = require('./simple.json')

examples/composition/components/datetime-format.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@
44
<meta charset="utf-8" />
55
<title>DatetimeFormat component examples</title>
66
<script src="../../../node_modules/vue/dist/vue.global.js"></script>
7-
<script src="../../../dist/vue-i18n.global.js"></script>
7+
<script src="../../../packages/vue-i18n/dist/vue-i18n.global.js"></script>
88
</head>
99
<body>
1010
<h1>DatetimeFormat component examples</h1>

examples/composition/components/number-format.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@
44
<meta charset="utf-8" />
55
<title>NumberFormat component examples</title>
66
<script src="../../../node_modules/vue/dist/vue.global.js"></script>
7-
<script src="../../../dist/vue-i18n.global.js"></script>
7+
<script src="../../../packages/vue-i18n/dist/vue-i18n.global.js"></script>
88
</head>
99
<body>
1010
<h1>NumberFormat component examples</h1>

examples/composition/components/translation.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@
44
<meta charset="utf-8" />
55
<title>Translation component example</title>
66
<script src="../../../node_modules/vue/dist/vue.global.js"></script>
7-
<script src="../../../dist/vue-i18n.global.js"></script>
7+
<script src="../../../packages/vue-i18n/dist/vue-i18n.global.js"></script>
88
</head>
99
<body>
1010
<h1>Translation component example</h1>

examples/composition/datetime.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@
44
<meta charset="utf-8" />
55
<title>Datetime localization</title>
66
<script src="../../node_modules/vue/dist/vue.global.js"></script>
7-
<script src="../../dist/vue-i18n.global.js"></script>
7+
<script src="../../packages/vue-i18n/dist/vue-i18n.global.js"></script>
88
</head>
99
<body>
1010
<div id="app">

examples/composition/directive/basic.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@
44
<meta charset="utf-8" />
55
<title>v-t directive basic usage</title>
66
<script src="../../../node_modules/vue/dist/vue.global.js"></script>
7-
<script src="../../../dist/vue-i18n.global.js"></script>
7+
<script src="../../../packages/vue-i18n/dist/vue-i18n.global.js"></script>
88
</head>
99
<body>
1010
<div id="app">

examples/composition/directive/object.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@
44
<meta charset="utf-8" />
55
<title>v-t directive object value usage</title>
66
<script src="../../../node_modules/vue/dist/vue.global.js"></script>
7-
<script src="../../../dist/vue-i18n.global.js"></script>
7+
<script src="../../../packages/vue-i18n/dist/vue-i18n.global.js"></script>
88
</head>
99
<body>
1010
<div id="app">

examples/composition/directive/plural.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@
44
<meta charset="utf-8" />
55
<title>v-t directive plural usage</title>
66
<script src="../../../node_modules/vue/dist/vue.global.js"></script>
7-
<script src="../../../dist/vue-i18n.global.js"></script>
7+
<script src="../../../packages/vue-i18n/dist/vue-i18n.global.js"></script>
88
</head>
99
<body>
1010
<div id="app">

examples/composition/directive/preserve.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@
44
<meta charset="utf-8" />
55
<title>v-t directive preserve content usage</title>
66
<script src="../../../node_modules/vue/dist/vue.global.js"></script>
7-
<script src="../../../dist/vue-i18n.global.js"></script>
7+
<script src="../../../packages/vue-i18n/dist/vue-i18n.global.js"></script>
88
<style>
99
.fade-enter-active,
1010
.fade-leave-active {

examples/composition/fallback/basic.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@
44
<meta charset="utf-8" />
55
<title>Fallback basic example</title>
66
<script src="../../../node_modules/vue/dist/vue.global.js"></script>
7-
<script src="../../../dist/vue-i18n.global.js"></script>
7+
<script src="../../../packages/vue-i18n/dist/vue-i18n.global.js"></script>
88
</head>
99
<body>
1010
<div id="app">

examples/composition/fallback/component.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@
44
<meta charset="utf-8" />
55
<title>Component fallback example</title>
66
<script src="../../../node_modules/vue/dist/vue.global.js"></script>
7-
<script src="../../../dist/vue-i18n.global.js"></script>
7+
<script src="../../../packages/vue-i18n/dist/vue-i18n.global.js"></script>
88
<style>
99
#app {
1010
border: red solid;

examples/composition/fallback/default-format.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@
44
<meta charset="utf-8" />
55
<title>Fallback with default example</title>
66
<script src="../../../node_modules/vue/dist/vue.global.js"></script>
7-
<script src="../../../dist/vue-i18n.global.js"></script>
7+
<script src="../../../packages/vue-i18n/dist/vue-i18n.global.js"></script>
88
</head>
99
<body>
1010
<div id="app">

examples/composition/fallback/format.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@
44
<meta charset="utf-8" />
55
<title>Fallback format example</title>
66
<script src="../../../node_modules/vue/dist/vue.global.js"></script>
7-
<script src="../../../dist/vue-i18n.global.js"></script>
7+
<script src="../../../packages/vue-i18n/dist/vue-i18n.global.js"></script>
88
</head>
99
<body>
1010
<div id="app">

examples/composition/fallback/option.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@
44
<meta charset="utf-8" />
55
<title>Fallback warning with option example</title>
66
<script src="../../../node_modules/vue/dist/vue.global.js"></script>
7-
<script src="../../../dist/vue-i18n.global.js"></script>
7+
<script src="../../../packages/vue-i18n/dist/vue-i18n.global.js"></script>
88
</head>
99
<body>
1010
<div id="app">

0 commit comments

Comments
 (0)