Converting legacy Docker setup to CMA
We have an older magento-docker setup for ScandiPWA 1, 2, 3 but since it is not very versatile when it comes to development, you can "upgrade" it to use CMA!
Go to
src
folder and install CMA:cd ./src
# if npm is not initialized, then run
npm init -y
# then install @scandipwa/magento-scripts package
npm i @scandipwa/[email protected]
# and make sure your package.json has the following scripts:
{
...
"scripts": {
"start": "magento-scripts start",
"stop": "magento-scripts stop",
"cli": "magento-scripts cli",
"logs": "magento-scripts logs",
"link": "magento-scripts link",
"status": "magento-scripts status",
"exec": "magento-scripts exec",
"import-db": "magento-scripts import-db"
}
...
}
You need to adjust
require-dev
dependencies, ideally just replace them with the following ones which are shipped in default Magento 2.3 template:{
...
"require-dev": {
"allure-framework/allure-phpunit": "~1.2.0",
"dealerdirect/phpcodesniffer-composer-installer": "^0.5.0",
"friendsofphp/php-cs-fixer": "~2.14.0",
"lusitanian/oauth": "~0.8.10",
"magento/magento-coding-standard": "*",
"magento/magento2-functional-testing-framework": "~2.6.4",
"pdepend/pdepend": "2.5.2",
"phpcompatibility/php-compatibility": "^9.3",
"phpmd/phpmd": "@stable",
"phpstan/phpstan": "^0.12.2",
"phpunit/phpunit": "~6.5.0",
"sebastian/phpcpd": "~3.0.0",
"squizlabs/php_codesniffer": "~3.4.0"
}
...
}
Magento does not serve theme files in older ScandiPWA versions so we need to reconfigure webpack devserver.
Go to file
app/design/frontend/Scandiweb/pwa/src/config/webpack.development.config.js
and your configuration for devServer
should look like this:webpack.development.config.js
{
devServer: {
watchContentBase: true,
publicPath: '/',
historyApiFallback: true,
port: 3003,
https: false,
overlay: true,
compress: true,
inline: true,
hot: true,
// comment or remove lines below
// host: '0.0.0.0',
// public: 'scandipwa.local',
// allowedHosts: [
// '.local'
// ],
// add this to the config
// NOTE: to get magento port you can use [npm run status] command
proxy: {
'/graphql': 'http://localhost:<your magento port>'
}
}
}
Comment or remote
host
, public
and allowedHosts
properties and add proxy
property with a value of an object with mapping /graphql
url to our Magento url.If you want to use a port other than 3003 for the frontend you can! Just edit
port
property in this config file.Note that you cannot use ports below 1024 because it will require root privileges and for your own safety we do not recommend running scripts as root.
We have adjusted the project configuration enough to start working with CMA itself. Now we can try running the project.
Go to
src
folder and run:npm run start
To run frontend you will need to use a command
watch
:# go to frontend folder first
cd app/design/frontend/Scandiweb/pwa
npm run watch
In general, that is it!
magento-scripts will do this automatically!
To preserve data in the database, you will need to do as follows:
- 1.After you run magento setup, new MySQL volume will be created. You will need to get old mysql volume name and new one.
- 1.To get new mysql volume name, run command:docker container inspect <mysql container>and here go to the property
HostConfig.Mounts
and you should see volume name in aSource
field. - 2.To get an old mysql volume name you can just use template:
<folder name>_mysql-data
wherefolder name
is your folder name, you can get it by runningbasename "$PWD"
command.
- 2.Now, stop the project and run commands below with replaced
<new_volume>
name and<old_volume>
name values from the steps before.npm run stop # to stop the projectdocker volume rm <new_volume>docker volume create --name <new_volume>docker run --rm -it -v <old_volume>:/from:ro -v <new_volume>:/to alpine \ash -c "cd /from ; cp -av . /to"That's it! If you want to save some space, you can delete the old volume altogether by running the command:docker volume rm <old_volume>
Since we are not using a clean Docker setup anymore, we don't need
docker-compose.*.yml
files, Dockerfile
files as well as build
and opt
folder.Go to the root directory of the project and run:
rm ./Makefile ./Dockerfile* ./docker-compose.*
rm -rf ./build ./opt
deploy
folder often has some necessary files, like latest.sql
, so we can keep it for now.Last modified 7mo ago