Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat: switch to NPM, update docs #276

Merged
merged 1 commit into from
Mar 26, 2020
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
5 changes: 1 addition & 4 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@
"lint:js": "eslint *.js src/assets/scripts",
"lint:styles": "stylelint src/assets/styles",
"lint": "npm-run-all lint:*",
"prepublishOnly": "npm run build",
"prepublishOnly": "npm run build:modules",
"release": "standard-version -t",
"test": "npm run lint",
"start": "concurrently \"npm run watch:assets\" \"npm run watch:components\" \"npm run watch:modules\"",
Expand Down Expand Up @@ -103,8 +103,5 @@
"stylelint-declaration-use-variable": "^1.7.2",
"stylelint-order": "^4.0.0",
"vue-template-compiler": "^2.6.11"
},
"publishConfig": {
"registry": "https://npm.pkg.github.com/"
}
}
2 changes: 1 addition & 1 deletion src/docs/development/releasing.md
Original file line number Diff line number Diff line change
Expand Up @@ -3,4 +3,4 @@
We use [standard-version](https://github.com/conventional-changelog/standard-version) to generate a changelog from git commits and bump the package version.

1. Run `npm run release`. If the version you're working on is a pre-release, run `npm run release -- --prerelease alpha|beta|rc`.
2. Run `npm publish` to publish a new package to [GitHub Packages](https://github.com/features/packages).
2. Run `npm publish` to publish a new package to [NPM](https://npmjs.com).
62 changes: 26 additions & 36 deletions src/docs/usage/sage.md
Original file line number Diff line number Diff line change
Expand Up @@ -10,17 +10,7 @@ This document assumes that you are using [Sage 10](https://github.com/roots/sage

## Installation

Pinecone must be installed from [GitHub Packages](https://github.com/features/packages). In order to add Pinecone to your project, you'll need to complete the following steps:

1. [Authenticate to GitHub Packages](https://help.github.com/en/packages/using-github-packages-with-your-projects-ecosystem/configuring-npm-for-use-with-github-packages#authenticating-to-github-packages).

2. In your project directory, create a file named `.npmrc` with the following contents:

```bash
registry=https://npm.pkg.github.com/platform-coop-toolkit
```

3. Install Pinecone:
Pinecone must be installed from [NPM](https://npmjs.com). In order to add Pinecone to your project, you'll need to run the following command:

```bash
npm install --save @platform-coop-toolkit/pinecone
Expand All @@ -30,47 +20,47 @@ Pinecone must be installed from [GitHub Packages](https://github.com/features/pa

[Sage 10](https://github.com/roots/sage/tree/10.0.0-dev) uses [Laravel Mix](https://laravel-mix.com). To use Pinecone, your `webpack.mix.js` file should look like this:

```javascript
const mix = require('laravel-mix');
```javascript
const mix = require('laravel-mix');

mix.setPublicPath('./dist')
.browserSync('pinecone.test'); // Replace this with your local development URL.
mix.setPublicPath('./dist')
.browserSync('pinecone.test'); // Replace this with your local development URL.

mix.sass('resources/assets/styles/main.scss', 'styles', {
sassOptions: {
includePaths: [path.join(__dirname, 'node_modules')],
},
});
mix.sass('resources/assets/styles/main.scss', 'styles', {
sassOptions: {
includePaths: [path.join(__dirname, 'node_modules')],
},
});

mix.js('resources/assets/scripts/main.js', 'scripts')
.extract();
mix.js('resources/assets/scripts/main.js', 'scripts')
.extract();

mix.copy('resources/assets/images', 'dist/images')
.copy('resources/assets/fonts', 'dist/fonts')
.copy('node_modules/@platform-coop-toolkit/pinecone/src/assets/images', 'dist/images')
.copy('node_modules/@platform-coop-toolkit/pinecone/src/assets/fonts', 'dist/fonts');
mix.copy('resources/assets/images', 'dist/images')
.copy('resources/assets/fonts', 'dist/fonts')
.copy('node_modules/@platform-coop-toolkit/pinecone/src/assets/images', 'dist/images')
.copy('node_modules/@platform-coop-toolkit/pinecone/src/assets/fonts', 'dist/fonts');

mix.options({
processCssUrls: false,
});
```
mix.options({
processCssUrls: false,
});
```

### Sass

At the top of `resources/assets/styles/main.scss`, add the following line:

```scss
@import "~@platform-coop-toolkit/pinecone";
```
```scss
@import "~@platform-coop-toolkit/pinecone";
```

Pinecone's component styles, Sass functions and utility classes will now be available for use within your theme's Sass.

### JavaScript

At the top of `resources/assets/scripts/main.js`, add the following line:

```javascript
import Pinecone from '@platform-coop-toolkit/pinecone';
```
```javascript
import Pinecone from '@platform-coop-toolkit/pinecone';
```

Pinecone's JavaScript classes will now be available for use within your theme's JavaScript.