refactor(angular): move to packages directory (#27719)

Issue number: N/A

---------

<!-- Please do not submit updates to dependencies unless it fixes an
issue. -->

<!-- Please try to limit your pull request to one type (bugfix, feature,
etc). Submit multiple pull requests if needed. -->

## What is the current behavior?
<!-- Please describe the current behavior that you are modifying. -->

The `angular` directory sits at the root of the project instead of in
`packages` with all the other JS Framework integrations. This does not
cause any functional issues with Ionic, but it is confusing since
integrations are not in a consistent place.

## What is the new behavior?
<!-- Please describe the behavior or changes that are being added by
this PR. -->

- Moves the `angular` directory to `packages/angular`

Note: Most files should remain unchanged. The only files I changed are
the files that had direct paths to the old `angular` directory:

1. Removes the `angular` path in `lerna.json`. This is now covered by
`packages/*`
2. Updated the angular file path in `.gitignore`
3. Updates the path to the angular package in `stencil.config.ts` for
the Angular Output Targets
4. Updates some of Angular's sync scripts to correctly get the core
stylesheets as well as the core package.
5. Updates the test app sync script to correctly sync core and
angular-server

~I'm not entirely sure why GitHub thinks
https://github.com/ionic-team/ionic-framework/pull/27719/files#diff-f5bba7e7c7c75426e2b9c89868310cb03890493b4efe0252adf8d12cc8398962
is a new file since it exists in `main` here:
1f06be4a31/angular/test/base/scripts/build-ionic.sh~
Fixed in
6e7fc49827

## Does this introduce a breaking change?

- [ ] Yes
- [x] No

<!-- If this introduces a breaking change, please describe the impact
and migration path for existing applications below. -->


## Other information

<!-- Any other information that is important to this PR such as
screenshots of how the component looks before and after the change. -->

Dev build: `7.1.2-dev.11688052109.13454f5c`
This commit is contained in:
Liam DeBeasi
2023-07-05 13:52:35 -04:00
committed by GitHub
parent e5ab6d8804
commit 32bc33ed28
268 changed files with 29 additions and 30 deletions

View File

@ -0,0 +1,21 @@
# Local @ionic/angular test/testapp development
1. `npm install` at the root of `angular`
2. `npm run build.dev` to build local `@ionic/angular` and `@ionic/core`
3. `cd test/testapp` to the test app
4. `npm install` in the test app directory
5. `npm run serve` copies packages and serve the app (see package.json for more options)
6. [http://localhost:4200/](http://localhost:4200/)
# npm link local development
`npm link` doesn't work as expected due to the `devDependency` on `@angular/core`. This is the work around...
npm run build.link ../ionic-conference-app
When the command above is ran from the `angular` directory, it will build `@ionic/angular` and copy the `dist` directory to the correct location of another local project. In the example above, the end result is that it copies the `dist` directory to `../ionic-conference-app/node_modules/@ionic/angular/dist`. The path given should be relative to the root of this mono repo.
## package.json note
The `package.json` file in this directory references __Ionic 3__ and is in here to get GitHub to properly show the Used By counts on the repo. __Do not remove it!__

53
packages/angular/scripts/build-core.js vendored Normal file
View File

@ -0,0 +1,53 @@
const fs = require('fs-extra');
const path = require('path');
const spawn = require('child_process').spawn;
const typescriptPath = path.join(__dirname, '..', 'node_modules', '.bin');
function copyCSS() {
const src = path.join(__dirname, '..', '..', '..', 'core', 'css');
const dst = path.join(__dirname, '..','dist', 'css');
fs.removeSync(dst);
fs.copySync(src, dst);
}
function buildSchematics(){
return new Promise((resolve, reject) => {
const cmd = 'tsc';
const args = [
'--project',
path.join(__dirname, '..', 'tsconfig.schematics.json'),
];
const p = spawn(cmd, args, { cwd: typescriptPath, stdio: 'inherit', shell: true });
p.on('close', (code) => {
if (code > 0) {
console.log(`ng-add build exited with ${code}`);
reject();
} else {
resolve();
}
});
});
}
function copySchematicsJson(){
const src = path.join(__dirname, '..', 'src', 'schematics', 'collection.json');
const fileSrc = path.join(__dirname, '..', 'src', 'schematics', 'add', 'files');
const dst = path.join(__dirname, '..', 'dist','schematics', 'collection.json');
const fileDst = path.join(__dirname, '..', 'dist', 'schematics', 'add', 'files');
const schemaSrc = path.join(__dirname, '..', 'src', 'schematics', 'add', 'schema.json');
const schemaDst = path.join(__dirname, '..', 'dist', 'schematics', 'add', 'schema.json');
fs.removeSync(dst);
fs.removeSync(fileDst);
fs.copySync(src, dst);
fs.copySync(fileSrc,fileDst);
fs.copySync(schemaSrc, schemaDst);
}
copyCSS();
buildSchematics();
copySchematicsJson()

View File

@ -0,0 +1,42 @@
const path = require('path');
const cwd = process.cwd();
const glob = require('glob');
const fs = require('fs-extra');
const distDir = path.join(__dirname, '../dist');
const distGeneratedNodeModules = path.join(distDir, 'node_modules');
function doGlob(globString) {
return new Promise((resolve, reject) => {
glob(globString, (err, matches) => {
if (err) {
return reject(err);
}
resolve(matches);
})
});
}
function getCodegenedFilesToDelete() {
const ngFactoryGlob = path.join(distDir, '**', '*ngfactory*');
const ngSummaryGlob = path.join(distDir, '**', '*ngsummary*');
const promises = [];
promises.push(doGlob(ngFactoryGlob));
promises.push(doGlob(ngSummaryGlob));
return Promise.all(promises).then(listOfGlobResults => {
const deleteFilePromises = [];
listOfGlobResults.forEach(fileMatches => {
fileMatches.forEach(filePath => {
deleteFilePromises.push(fs.remove(filePath));
})
})
return Promise.all(deleteFilePromises);
});
}
Promise.all([
getCodegenedFilesToDelete(),
fs.remove(distGeneratedNodeModules)
]);

12
packages/angular/scripts/clean.js vendored Normal file
View File

@ -0,0 +1,12 @@
const fs = require('fs-extra');
const path = require('path');
const ROOT_DIR = path.join(__dirname, '..');
const cleanDirs = [
path.join(ROOT_DIR, 'dist')
];
cleanDirs.forEach(dir => {
fs.emptyDirSync(dir);
});

40
packages/angular/scripts/link-copy.js vendored Normal file
View File

@ -0,0 +1,40 @@
const fs = require('fs-extra');
const path = require('path');
let prjDir = process.argv[2];
if (!prjDir) {
throw new Error('local path required as last argument to "npm run build.link" command');
}
prjDir = path.join(__dirname, '../../../', prjDir);
copyPackage(prjDir, 'angular');
copyPackage(prjDir, 'core');
function copyPackage(prjDir, pkgName) {
const prjDest = path.join(prjDir, 'node_modules', '@ionic', pkgName);
const pkgSrcDir = path.join(__dirname, '..', '..', pkgName);
const pkgSrcDist = path.join(pkgSrcDir, 'dist');
const pkgJsonPath = path.join(pkgSrcDir, 'package.json');
const pkgJson = require(pkgJsonPath);
// make sure this local project exists
fs.emptyDirSync(prjDest);
pkgJson.files.push('package.json');
pkgJson.files.forEach(f => {
const src = path.join(pkgSrcDir, f);
const dest = path.join(prjDest, f);
console.log('copying:', src, 'to', dest);
fs.copySync(src, dest);
});
const prjReadme = path.join(prjDest, 'README.md');
console.log('readme:', prjReadme);
fs.writeFileSync(prjReadme, '@ionic/' + pkgName + ' copied from ' + pkgSrcDir + ', ' + new Date());
}

View File

@ -0,0 +1,16 @@
{
"name": "ionic-angular",
"version": "`gulp package` generates dist/package.json from this template using the root ./package.json",
"description": "",
"keywords": [],
"repository": {
"type": "git",
"url": "git+https://github.com/ionic-team/ionic-framework.git"
},
"license": "MIT",
"main": "umd/index.js",
"module": "index.js",
"es2015": "es2015/index.js",
"peerDependencies": {
}
}

View File

@ -0,0 +1,22 @@
import resolve from '@rollup/plugin-node-resolve';
export default {
input: 'build/es2015/core.js',
output: [
{
file: 'dist/fesm2015.js',
format: 'es'
}
],
external: (id) => {
// anything else is external
// Windows: C:\xxxxxx\xxx
const colonPosition = 1;
return !(id.startsWith('.') || id.startsWith('/') || id.charAt(colonPosition) === ':');
},
plugins: [
resolve({
mainFields: ['module']
})
]
};

View File

@ -0,0 +1,18 @@
import config from './rollup.config';
const newConfig = {
...config,
input: 'build/es5/core.js',
};
newConfig.output = [
{
file: 'dist/fesm5.js',
format: 'es'
},
{
file: 'dist/fesm5.cjs.js',
format: 'cjs'
}
];
export { newConfig as default };

View File

@ -0,0 +1,12 @@
#!/bin/bash
set -e
# Delete old packages
rm -f *.tgz
# Pack @ionic/core
npm pack ../../core
# Install Dependencies
npm install *.tgz --no-save