BigCommerce--安装stencil-cli

BigCommerce官方文档地址:https://developer.bigcommerce.com/
写在最前面:
各位看官你们好,本文是通过官方文档和自己目前遇到的一些安装问题来写,有什么不对或其他见解欢迎指出。

一、什么是Stencil

Stencil是BigCommerce主题的引擎,主要是为BigCommerce Cornerstone 主题提供支持(常用stencil start 启动项目 stencil bundle 打包项目)。Cornerstone主题是BigCommerce快速开发的基石和起源,在Github上开源。主题浏览地址:https://cornerstone-light-demo.mybigcommerce.com/
Stencil主题中的Page Builder (BC后台–>Strorefront–>My Themes --> Customize)工具能够让商家在没有编码的情况下自定义店面的外观和感觉。

二、Stencil cli

Stencil 基于逻辑的模板允许 BigCommerce 开发人员使用轻量级模板语言Handlebars.js有效地自定义店面页面。Handlebars.js 允许您有效地将动态和条件逻辑嵌入到店面页面中。

三、安装Stencil

(因为我是windows系统,Mac的就是跟着文档来的)

Mac上面安装

# For ARM based macs
arch -x86_64 /bin/zsh

# Install Node Version Manager (nvm)
curl -o- https://raw.githubusercontent.com/creationix/nvm/v0.31.0/install.sh | bash

# Install Stencil CLI supported version of Node.js
nvm install 12

# Switch to Stencil CLI supported version of Node.js:
nvm use 12

# Install Stencil CLI
npm install -g @bigcommerce/stencil-cli

在带有 Apple 芯片的 Mac 上安装
在使用 Apple 芯片(例如 M1 芯片)的 Mac 上安装 Stencil CLI 及其依赖项需要 Rosetta。Rosetta 允许配备 Apple 芯片的 Mac 使用为配备 Intel 处理器的 Mac 构建的应用程序。以下步骤将指导您打开 Rosetta 终端并安装 Stencil CLI 及其依赖项。
打开 Rosetta 终端:

  1. 打开查找器。
  2. 转到应用程序>实用程序>终端。
  3. 右键单击终端并选择获取信息。
  4. 选中使用 Rosetta 打开复选框。
  5. 关闭窗口并退出所有终端实例。
  6. 启动一个新终端,并根据提示安装 Rosetta。

运行以下命令:

# Install Stencil CLI supported version of Node.js
nvm install 12

# Switch to Stencil CLI supported version of Node.js
nvm use 12

# Install Stencil CLI
npm install -g @bigcommerce/stencil-cli

Windows上安装

注意:目前支持node.js 12 不支持14 ,所以用nvm进行版本管理比较方便
方法一 :使用chocolatey安装依赖

步骤一:安装chocolatey

// BC文档里面的安装基本上都会有有问题,下面是我用过成功的方法
# one 用管理员身份打开cmd.exe ,执行下面代码(第一种安装方法)
@"%SystemRoot%\System32\WindowsPowerShell\v1.0\powershell.exe" -NoProfile -InputFormat None -ExecutionPolicy Bypass -Command "iex ((New-Object System.Net.WebClient).DownloadString('https://chocolatey.org/install.ps1'))" && SET "PATH=%PATH%;%ALLUSERSPROFILE%\chocolatey\bin"
#  two 用管理员身份打开powershell.exe,执行下面代码(第二种安装方法)
Set-ExecutionPolicy Bypass -Scope Process -Force; iex ((New-Object System.Net.WebClient).DownloadString('https://chocolatey.org/install.ps1'))

步骤二: 使用chocolatey安装git(如果你的电脑没有git)

choco install git

步骤三: 安装nvm管理node.js版本,安装node.js 12 和npm

choco install nvm; nvm install 12; nvm use 12

步骤四:(如果前面没有用管理员方式打开PowerShell,这里需要关闭后重新以管理员方式打开)安装Window c++构建工具,同时也安装python 2

npm install -g windows-build-tools --vs2015

步骤五: 使用python2

npm config set python python2.7

步骤六:安装Stencil CLI

npm install -g @bigcommerce/stencil-cli

方法二:不使用chocolatey依赖,自己安装所需要的依赖
所需依赖项:
不想在官方下载的–>点击下载

  1. Node.js 12 和npm (windows下当前不支持更高的node.js版本)
    node.js 12所有版本官网链接:https://npmmirror.com/mirrors/node/latest-v12.x/

直接下载node-v12.0.0-x64.msi 链接:node-v12.0.0-x64.msi
在这里插入图片描述
点击Next
在这里插入图片描述
勾选I accept the terms in the License Agreement,然后Next
在这里插入图片描述
这里自定义安装路径,路径不要有中文
在这里插入图片描述
然后一直Next
在这里插入图片描述
在这里插入图片描述
点击Install 安装。
在这里插入图片描述
在这里插入图片描述
安装完后Win+R ,cmd检查版本

node -v
npm -v

在这里插入图片描述
现在的node安装自带npm,不用再单独安装npm

  1. Git -需要运行npm install
    进入官网 git-scm
    在这里插入图片描述
    在这里插入图片描述

在这里插入图片描述
选择安装路径(路径上不要有中文)
在这里插入图片描述
没勾的根据自己需求勾√
在这里插入图片描述
然后一直下一步(Next)就好。

  1. Python 2.7.x 需要构建一些依赖项
    进入官网下载:https://www.python.org/downloads/
    目前最新版本是:2.7.18
    这里讲的安装Windows x86-64 MSI installer
    在这里插入图片描述
    在这里插入图片描述
    在这里插入图片描述
    然后点击Next ,安装后可能会让你重启
    win+R --》cmd 执行Python 检查版本号
  2. Visual C++ Build Tools 2015 需要编译一些依赖项
    点击下载
    双击visualcppbuildtools_full.exe,选择默认即可,点击安装,等待10分钟左右即可完成安装。

上面的依赖安装和配置完成之后,使用npm安装Stencil CLI

npm install -g @bigcommerce/stencil-cli

在Linux上安装

要在基于 debian 的发行版上安装 Stencil CLI 和依赖项,请打开终端并运行以下命令:

# Download and install nvm if you don't have it.
curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.36.0/install.sh | bash

# Reload .bashrc so nvm command works
source ~/.bashrc

# Explicitly install and use supported node version
nvm install 12

nvm use 12

# Install stencil
npm install -g @bigcommerce/stencil-cli

根据发行版,您可能还需要安装:

  • g++
  • libsass
  • git
  • 1
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值