jsdrupal / drupal-admin-ui

This is an admin UI for Drupal, built with JavaScript & React. ⬅️✌️➡️
Other
238 stars 91 forks source link

Setting up development environment on Windows 10 Pro/Docker for Windows #725

Open captaindav opened 5 years ago

captaindav commented 5 years ago

I am trying to create a Docker based development environment for Drupal Admin Ui project () on a Windows 10 Pro machine, that has the requirements installed (Node > 10, Yarn, Docker, Docker Composer). When I follow the steps:

git clone git@github.com:jsdrupal/drupal-admin-ui.git cd drupal-admin-ui make build docker-compose up (open a new terminal) make install

on the 3rd step, I get an error "make is not a recognized command..." which makes sense as I am working in a Windows command window, not Linux, so there is no make command. Do the above steps only work on Linux/Mac machines? Does anyone have an idea how to best proceed on a Win 10 Pro machine that has Docker for Windows installed? (I also posted this question to the Slack Drupal #javascript).

dawehner commented 5 years ago

hi @captaindav I haven't used windows in a while, but I think you have to install make manually, for example following https://stackoverflow.com/a/54086635/637596

Let us know whether this resolved it for you!

captaindav commented 5 years ago

That is a good idea, I installed Make for Windows (http://gnuwin32.sourceforge.net/packages/make.htm) then added: new-item alias:make -value 'C:\Program Files (x86)\GnuWin32\bin\make.exe' to my profile.ps1 file located in C:\Windows\System32\WindowsPowerShell\v1.0 which makes the make command available in PowerShell.

When I run 'make build' in PowerShell I get an error:

PS C:\drupal-admin-ui> make build                                                                                                                                           ! was unexpected at this time.
makefile:8: .env: No such file or directory
make: *** No rule to make target `.env'.  Stop.

I will look into the error next but wanted to post here in case the solution is obvious.

One thing I was not sure about, should I be copying .env.defaults to .env and then specifying values for HOST_UID and HOST_GID? If so, what should be the values for those variables?

captaindav commented 5 years ago

I could not get Windows make to work, it may be that a separate make file is needed for Windows, I also found that make on Windows has a lot of issues, and that use of "cmake" (cross platform make) may be required. Thus I did not use make, but rather issued the same docker commands found in the make file directly in PowerShell, which worked fine.

I was able to get the development environment working in Windows, but had by disable the createUser.sh script in the Dockerfile, and change the user name from nginx to root. This is intended as a temporary solution until a way is found to properly set the user and group ids in Windows. I created a PowerShell profile file which has instructions and aliases for commonly used Docker commands. I have listed the contents of the profile file below, I can create a pull request if you would like to include the file in the project.

<#
 # PowerShell Profile file for using Docker with Drupal Admin UI.
 #1
 # Here are the steps to setting up a Drupal Admin UI development environment in Windows:
 #
 # STEP 1: Install Docker for Windows, see:
 # https://docs.docker.com/docker-for-windows
 #
 # STEP 2: Install Git for Windows, see:
 # https://gitforwindows.org
 #
 # STEP 3: Enable PowerScript scripting at:
 # Settings -> Update & Security -> For Developers,
 # pick "Developer mode" and then click "Apply" after checking
 # the PowerShell -> Change execution policy checkbox.
 #
 # STEP 4: Place this file in your Windows PowerShell directory,
 # typically C:\Windows\System32\WindowsPowerShell\v1.0.  Change the
 # project directory location (cd command near line 110) to your project's location.
 #
 # STEP 5: Start PowerShell with "Run as Administrator" privileges.
 #
 # STEP 6: Turn off git processing of line endings by issuing the command:
 # git config --global core.autocrlf false
 #
 # STEP 7: Clone the Drupal Admin UI project by going to the desired location
 # and typing "cloneAdmin" (this is a PowerShell alias).  Then use the alias "p"
 # to switch to the project directory.
 #
 # STEP 8: Edit .docker/images/drupal/DockerFile, commenting out line 24 (createUser.sh) and
 # changing the user from nginx to root in line 36.
 #
 # STEP 9: Enter "p" to go to the main project directory and issue the command "up", this will
 # build the Docker images and create the Docker containers.
 #
 # STEP 10: Delete the patches from demo/templates/composer.json (delete lines 89-92)
 #
 # STEP 11: Enter the container using the command "ash" and then run setup.sh. Exit the container.
 #
 # STEP 12: Issue command "p" to go to the project directory, then install cross platform support for nodejs:
 # npm install --save-dev cross-env
 # Note: This assumes that nodejs, npm, and yarn are installed in Windows and available in PowerShell.
 #
 # STEP 13: Issue command "b" (alias for "yarn workspace @drupal/admin-ui build") to install and build the node packages.
 #
 # STEP 14: Issue command "s" (alias for "yarn workspace @drupal/admin-ui start") to run the webpack development server
 # on port 3000.
 #
 # The site should now be available at http://127.0.0.1 and the development server at http://127.0.0.1:3000.
 #
 #
 # Aliases created by this profile:
 #
 # ep: edit this profile
 # reload: reload this profile
 # c: clear screen
 # gits: git status
 # p: switch to drupal-admin-ui project directory
 # clone: clone the drupal-admin-ui projecti
 # b: build packaged version of admin ui project using webpack
 # s: start the admin ui development server on port 3000
 # di: docker info
 # dwipe: wipe all docker images, volumns, and containers
 # ash: run ash shell for drupal container
 # v: list all docker volumns
 # dbuild: docker-compose build
 # up: docker-compose up -d
 # i: list all docker images
 # drmi: delete all docker images
 # drmid: delete all dangling docker images
 # dps: list containers
 # dstop: stop all containers
 # dkill: kill all running containers
 # drma: remove all stopped containers
 # b: build admin ui project webpack packages version
 # s: start admin ui project development version
 #
 #>

$Env:NODE_ENV += "development"

# Edit this profile.
function editProfile {
    cd C:\Windows\System32\WindowsPowerShell\v1.0
    notepad profile.ps1
}
Set-Alias ep editProfile

# Reload this profile (from command line call this with ". reload").
function reloadProfile {
    . C:\Windows\System32\WindowsPowerShell\v1.0\profile.ps1
}
Set-Alias reload reloadProfile

# Clear screen.
function cls {
    cls
}
Set-Alias c cls

##### Git  #####

# Status
function gitStatus {
  git status
}
Set-Alias gits gitStatus

##### Drupal Admin UI  #####

# Switch to the Admin UI project directory.
function adminUIDirectory {
  # Change line below to the location of your Drupal Admin UI directory.
  cd D:\drupal-admin-ui
}
Set-Alias p adminUIDirectory

# Clone the Admin UI project.
function cloneAdminUI {
  git clone git@github.com:jsdrupal/drupal-admin-ui.git
}
Set-Alias clone cloneAdminUI

# Build the Admin UI project using webpack.
function buildAdminUI {
  yarn workspace @drupal/admin-ui build
}
Set-Alias b buildAdminUI

# Start the Admin UI development server on port 3000.
function startAdminUI {
  yarn workspace @drupal/admin-ui start
}
Set-Alias s startAdminUI

##### Docker #####

# Info.
function dockerInfo {
    docker info | more
}
Set-Alias di dockerInfo

# Wipe all.
function dockerWipe {
     # Stop all containers.
     docker stop $(docker ps -a -q)
     #Remove all stopped containers, dangling images, volumes, and unused network and build cache.
     docker system prune --force --volumes
     #Remove all images.
     docker rmi $(docker images -q)
}
Set-Alias dwipe dockerWipe

# Run ash shell.
function dockerAsh {
     docker exec -it drupal_admin_ui_drupal ash
}
Set-Alias ash dockerAsh

# Volumes.
function listVolumes {
    docker volume ls
}
Set-Alias v listVolumes

##### Docker Compose #####

# Compose build.
function dockerComposeBuild {
    docker-compose build
}
Set-Alias b dockerComposeBuild

# Compose up.
function dockerComposeUp {
    docker-compose up -d
}
Set-Alias up dockerComposeUp

##### Docker Images #####

# List images.
function dockerImages {
    docker images
}
Set-Alias i dockerImages

# Remove all images.
function removeAllImages {
    docker rmi $(docker images -q)
}
Set-Alias drmi deleteAllImages

# Docker - delete dangling images.
function removeDanglingImages {
    docker rmi $(docker images -q --filter "dangling=true")
}
Set-Alias drmid removeDanglingImages

##### Docker Containers #####

# List running containers.
function listContainers {
    docker ps
}
Set-Alias dps listContainers

# List all containers.
function listAllContainers {
    docker container ls -a
}
Set-Alias dls listAllContainers

# Docker - stop (gracefully) all containers.
function stopAllContainers {
    docker stop $(docker ps -a -q)
}
Set-Alias dstop stopAllContainers

# Kill all running containers.
function killAllRunningContainers {
    kill $(docker ps -q)
}
Set-Alias dkill killAllRunningContainers

# Remove all stopped containers.
function deleteAllStoppedContainers {
    docker rm $(docker ps -a -q)
}
Set-Alias drma deleteAllStoppedContainers