网站服务部小组文档

mac 下修改操作

强烈推荐使用 nvm 管理,以下操作基于 nvm 的基础上

操作步骤：

首先切换到V6.11及以上 V6.X 版本(此处以6.14.2为例)

设置为淘宝镜像

npm config set registry https://registry.npm.taobao.org

全局安装核心库

 npm install -g webpack webpack-cli webpack-dev-server //webpack核心、命令行工具、调试服务

下载git 模板（参见文档上）

将 package.json拷贝到
```
~/.nvm/versions/node/v6.14.2/lib/
```
切换命令行到当前目录，在命令行中输入：npm install进行插件/loader安装
修改变量
- 首先查看 shell 类型
- 在终端输入 echo $SHELL
  
  如果输出的是：csh或者是tcsh，那么你用的就是C Shell。
  
  如果输出的是：bash，sh，zsh，那么你的用的可能就是Bourne Shell的一个变种。
  
  Mac OS X 10.2之前默认的是C Shell。Mac OS X 10.3之后默认的是Bourne Shell。
  
  如果你是默认的bourne shell 那么修改~/.bash_profile即可，如果你跟我一样使用的 zsh，那么修改~/. zshrc 即可；
- 打开你的.zshrc文件( vim ~/.zshrc)，增加下面内容（修改为你自己对应的文件夹）
```
export NODE_PATH=/Users/tangzhao/.nvm/versions/node/v6.14.2/lib/node_modules
```
- 然后 source ~/.zshrc 即可；
- 如何判断是否添加成功，打开命令行，输入 node 进入 node 环境以后输入
```
process.env.NODE_PATH  //输入此行内容
'/Users/tangzhao/.nvm/versions/node/v6.14.2/lib/node_modules'   //此为输出结果，如为 undefined就说明不成功
```
进入类似如下路径：（修改为你自己对应的文件夹） /Users/tangzhao/.nvm/versions/node/v6.14.2/lib/node_modules/webpack/node_modulesenhanced-resolve/lib/

修改ModulesInHierachicDirectoriesPlugin.js文件，在第26行后面回车

forEachBail(addrs, (addr, callback) => {   //这一句话前面，请注意是前面，千万别写到 foreach 里面去了！！！

添加代码addrs.push(process.env.NODE_PATH);

修改以后类似如下

apply(resolver) {
        const target = resolver.ensureHook(this.target);
        resolver.getHook(this.source).tapAsync("ModulesInHierachicDirectoriesPlugin", (request, resolveContext, callback) => {
            const fs = resolver.fileSystem;
            const addrs = getPaths(request.path).paths.map(p => {
                return this.directories.map(d => resolver.join(p, d));
            }).reduce((array, p) => {
                array.push.apply(array, p);
                return array;
            }, []);
            addrs.push(process.env.NODE_PATH); //此为新增的内容
            forEachBail(addrs, (addr, callback) => {
                fs.stat(addr, (err, stat) => {
                    if(!err && stat && stat.isDirectory()) {
                        const obj = Object.assign({}, request, {
                            path: addr,
                            request: "./" + request.request
                        });
                        const message = "looking for modules in " + addr;
                        return resolver.doResolve(target, obj, message, resolveContext, callback);
                    }
                    if(resolveContext.log) resolveContext.log(addr + " doesn't exist or is not a directory");
                    if(resolveContext.missing) resolveContext.missing.add(addr);
                    return callback();
                });
            }, callback);
        });
    }

重新打开命令行，即可全局使用webpack