- Como podemos usá-lo no Magento 2.3.0?
- No Magento 2.3.0, eles afirmam que o PWA é suportado?
- Como podemos começar com esse ótimo recurso para experimentar a novidade?
Respostas:
** Vamos começar com a instalação do Magento 2.3 com PWA **
1. Digite o seguinte comando em DIR / var / www / html / (m230 é o meu diretório Magento 2.3):
composer create-project --repository=https://repo.magento.com/ magento/project-community-edition=2.3.* --stability=beta m230
2. Instale o Magento por linha de comando:
bin/magento setup:install --base-url=http://localhost/m230 --db-host=localhost --db-name=m230 --db-user=root --db-password=root --backend-frontname=admin --admin-firstname=admin --admin-lastname=admin --admin-email=admin@admin.com --admin-user=admin --admin-password=admin123 --language=en_US --currency=USD --timezone=America/Chicago --use-rewrites=1
3. Crie o tema pwa base, que será o pai deles para [PWA Venia theme.] [25]
4. Crie um diretório app/design/frontend/Magento/pwa
e copie todos os arquivos e diretórios do tema base aqui.
Vamos verificar se o tema base está disponível ou não.
Run: php bin/magento setup:upgrade
E navegue até o Magento Admin-> Conteúdo-> Temas
5. Faça o download do projeto do estúdio PWA.
6. Navegue até o diretório raiz da instalação do Magento e crie uma pasta de link simbólico do Pwa com o link para o diretório do módulo do projeto (pwa-studio / packages / pwa-module).
deste diretório, eu executo meu comando - / var / www / html / m230
Este é um diretório em que minha fonte baixada do pwa é / var / www / html / PWA /
ln -s /var/www/html/PWA/pwa-studio/packages/pwa-module app/code/Magento/Pwa
7. Vincule também o diretório do tema. Navegue até o diretório raiz da instalação do Magento e crie uma pasta de link simbólico Pwa vinculando ao diretório do módulo do projeto (pwa-studio / packages / venia-concept).
ln -s /var/www/html/PWA/pwa-studio/packages/venia-concept app/design/frontend/Magento/venia
8. Agora navegue até o diretório venia-concept do seu projeto pwa-studio, copie .env.dist
para um novo .env
arquivo e atualize as variáveis com o URL para sua loja de desenvolvimento Magento.
cd /var/www/html/PWA/pwa-studio/packages/venia-concept
cp .env.dist .env
9. Instale o tema venia e o módulo Pwa:
run: php bin/magento setup:upgrade
podemos ver que o tema venia foi instalado com sucesso.
10. Configure o tema venia a partir de admin->Content->Configuration
11. Navegue até o caminho ( /var/www/html/PWA/pwa-studio
) executado:
npm install
ou
npm install webpack-dev-server -g
12. E finalmente, navegue até /var/www/html/PWA/pwa-studio/packages/venia-concept
npm start
Parabéns! Você configurou seu ambiente de desenvolvimento para o projeto temático Venia.
Se você precisar de algo pronto para produção o mais cedo possível: Instalei e usei o sistema Vue Store Front (sistema de código aberto, a comunidade disponível através de respostas frouxas às perguntas, embora eu tenha sofrido algumas falhas, mas no geral o sistema é muito útil nesta fase da integração do PWA)
-> Utiliza Vue em vez de React. E também usa ElasticSearch e Docker. No geral, este sistema está se conectando principalmente ao Magento 2 via Rest API (e começa o GraphQL)
para começar:
Git clone https://github.com/DivanteLtd/vue-storefront
cd vue-storefront
yarn install
npm run installer
e, em seguida, yarn dev
liberar o cache, mas alterações no vue devem ser compiladas após alguns segundos, como um processo de observação.
Obviamente, o PWA que o Magento 2 constrói também é ótimo, mas infelizmente está se movendo rapidamente e não está claro quando estará pronto para competir com o VS (acima do sistema).
-> Achei melhor aprender graphql e possivelmente mais fácil de personalizar, mas possivelmente pelo motivo errado na época, esse PWA estava tendo css bruto nos arquivos de reação.
https://magento-research.github.io/pwa-studio/venia-pwa-concept/setup/
npm install
na instalação do magento 2.3, é necessário instalar o Venia Sample Data (consulte https://magento-research.github.io/pwa-studio/venia-pwa-concept/install-sample-data/ )
cd packages/venia-concept && npm run build
cd ../.. && npm run watch:venia
e aqui você deve ter um novo PWA pronto: ele parece se mover rapidamente há um mês, havia muito WIP e hoje, posso ver, por exemplo, falta de integração sass. Esta segunda opção pode ser melhor se você estiver pronto para aprender e criar este PWA com a comunidade Magento
Antes de tudo, instale a versão mais recente do Nó js usando o seguinte comando
- curl -sL https://deb.nodesource.com/setup_10.x | sudo bash -
- sudo apt-get install -y nodejs
- sudo apt install npm
Agora vá para o diretório raiz do Magento:
- cd var/www/html/pwa-magento/
Faça o download do diretório clone do PWA e instale o npm nesse diretório usando os seguintes comandos
- git clone https://github.com/magento-research/pwa-studio.git
- cd pwa-studio/
- sudo npm install
- cp packages/venia-concept/.env.dist packages/venia-concept/.env
- sudo npm run build
==========================================
se npx não encontrou erro PWA magento 2.3
- sudo npm i -g npx
se o erro for encontrado assim: Não é possível encontrar o módulo 'envalid', execute o seguinte comando
- sudo npm install i envalid
- sudo npm install envalid
se ocorrer um erro como esse, execute o seguinte comando: lerna ERR! npm run build -s saiu 1 em '@ magento / venia-concept'
- sudo npm restart
- sudo npm run stage:venia
- sudo npm cache clean -f
- sudo npm install -g n
- sudo n stable / sudo n latest (depends on version)
===========================================
- sudo npm i @magento/pwa-buildpack
- sudo npm i @magento/upward-js
- sudo npm i @magento/venia-concept
- sudo npm run build
- sudo npm run watch:venia
- sudo npm run watch:all
Você pode ir para o blog a seguir.
Como configurar o Magento 2.3 PWA
Além disso, ele explicará em detalhes sobre como usar o Magento 2.3 PWA para o seu site e usar.
Verificar Working Magento 2.3 PWA Demo