ScandiPWA CLI

Create Magento App Create ScandiPWA App User Manual GitHub
Search…
ScandiPWA CLI
A utility for accelerating development with Scandi
Example – with one command, create a component template in src/component/HugeTitle:
1
scandipwa create component HugeTitle
Copied!
A VSC plugin for Scandi CLI is also available!
Installation
Install the npm package globally:
1
npm i -g scandipwa-cli
Copied!
Usage
The CLI must be run from the the Scandi theme directory or a subdirectory.
Global options:
--help to get usage help
--version to print version number and exit
create component
Creates a new Scandi component​
Syntax:
1
create component [--container] [--redux] <name>
Copied!
Options:
--container/-c creates a container file for the component
--redux/-r connects the component to the Redux store with the connect HOC
name is the name of the component to be created
Examples:
1
scandipwa create component HugeTitle
2
# Output:
3
NOTE!
4
​
5
     The following files have been created:
6
     src/component/HugeTitle/HugeTitle.component.js
7
     src/component/HugeTitle/HugeTitle.style.scss
8
     src/component/HugeTitle/index.js
Copied!
1
scandipwa create component --container SpecialHeader
2
# Output:
3
NOTE!
4
​
5
     The following files have been created:
6
     src/component/SpecialHeader/SpecialHeader.component.js
7
     src/component/SpecialHeader/SpecialHeader.style.scss
8
     src/component/SpecialHeader/index.js
9
     src/component/SpecialHeader/SpecialHeader.container.js
Copied!
create route
Creates a new Scandi route​
Syntax:
1
create route [--container] [--redux] <name>
Copied!
Options:
--container/-c creates a container file for the route
--redux/-r connects the route to the Redux store with the connect HOC
name is the name of the route to be created
Example:
1
scandipwa create route MyLandingPage
2
# Output:
3
NOTE!
4
​
5
     The following files have been created:
6
     src/route/MyLandingPage/MyLandingPage.component.js
7
     src/route/MyLandingPage/MyLandingPage.style.scss
8
     src/route/MyLandingPage/index.js
Copied!
create store
Creates a new Scandi Redux store​
Syntax:
1
create store [--dispatcher-type=<"no"|"regular"|"query">] <name>
Copied!
Options:
--dispatcher-type/-d determines what type of dispatcher file will be created.
no (default) - does not create a dispatcher
regular - creates a simple helper class for dispatching actions
query - creates a dispatcher that extends QueryDispatcher
name is the name of the store to be created
Example:
1
scandipwa create store --d=query UserPreferences
2
# Output:
3
NOTE!
4
​
5
     The following files have been created:
6
     src/store/UserPreferences/UserPreferences.action.js
7
     src/store/UserPreferences/UserPreferences.dispatcher.js
8
     src/store/UserPreferences/UserPreferences.reducer.js
Copied!
create query
Creates a new Scandi query helper for querying with GraphQL
Syntax:
1
create query <name>
Copied!
name is the name of the query to be created
Example:
1
scandipwa create query Weather
2
# Output:
3
NOTE!
4
​
5
     The following files have been created:
6
     src/query/Weather.query.js
Copied!
deploy
Deploys your app to the cloud
Syntax:
1
deploy
Copied!
Example
1
 scandipwa deploy
2
yarn run v1.22.5
3
$ scandipwa-scripts build
4
Creating an optimized production build...
5
Build completed in 186.317s
6
​
7
Compiled successfully.
8
[...]
9
Done in 189.38s.
10
Build files compressed successfully.
11
Code upload result: OK. Code: 200
12
Build archive successfully removed.
13
Congrats, your code will be deployed in a few minutes! You can access it here: https://master.d16zgbgmy9fzgx.amplifyapp.com/
Copied!
extension install
Installs a Scandi extension
Syntax:
1
extension install [--no-enable] [--local] [--use=<path>] [--version=<required-version>] [--save-dev] <name>
Copied!
Options:
--no-enable will install the extension without enabling it
--local/-l: use a local module from packages/<name>
--use/-u: use a local module from the specified <path>
--version/-v specifies the extension version to use
save-dev/-D: install the package as a devDependency
name is the name of the extension to install
extension create
Creates a new scandi extension
Syntax:
1
extension create [--no-enable] <name>
Copied!
Options:
--no-enable will create and install the extension without enabling it
name specifies the name of the new extension
override component
Overrides a Scandi component. Will interactively ask for which parts to override.
Syntax:
1
override component [--styles=<"extend"|"override"|"keep">] [--source-module=<module>] [--target-module=<module>] <name>
Copied!
Options:
--styles/-S:
Not specified (default): will prompt interactively
keep: don't override styles
extend: adjust existing styles
override: completely replace existing styles
--source-module/-s: Path to the module to override the component from
--target-module/-t: Path to the module to generate the component in 
name is the name of the component to be overridden
Example:
1
scandipwa override component Header
2
? Choose things to extend in Header.component.js Header
3
? What would you like to do with styles? Extend
4
? Choose things to extend in Header.config.js 
5
? Choose things to extend in Header.container.js 
6
​
7
NOTE!
8
​
9
     The following files have been created:
10
     src/component/Header/Header.override.style.scss
11
     src/component/Header/Header.component.js
Copied!
override route
Overrides a Scandi route​
Syntax:
1
override route [--styles=<"extend"|"override"|"keep">] [--source-module=<module>] [--target-module=<module>] <name>
Copied!
Options:
--styles/-S:
Not specified (default): will prompt interactively
keep: don't override styles
extend: adjust existing styles
override: completely replace existing styles
--source-module/-s: Path to the module to override the route from
--target-module/-t: Path to the module to generate the route in 
name is the name of the route to be overridden
override store
Overrides a Scandi Redux store​
Syntax:
1
override store [--source-module=<module>] [--target-module=<module>] <name>
Copied!
Options:
--source-module/-s: Path to the module to override the store from
--target-module/-t: Path to the module to generate the store in 
name is the name of the store to be overridden
override query
Overrides a Scandi query helper​
Syntax:
1
override query [--source-module=<module>] [--target-module=<module>] <name>
Copied!
Options:
--source-module/-s: Path to the module to override the query from
--target-module/-t: Path to the module to generate the query in 
name is the name of the query to be overridden