上QQ阅读APP看书,第一时间看更新
How to do it...
We'll now see the most common problems using Windows for development:
- Terminal: The first problem you will face is to use the Windows terminal (CMD) because it does not support Unix commands (like Linux or Mac). The solution is to install a Unix Terminal; the most highly recommended is to use the Git Bash Terminal, which is included with Git when you install it (https://git-scm.com), and the second option is to install Cygwin, which is a Linux Terminal in Windows (https://www.cygwin.com).
- Environment variables: Another common problem using Windows is to set environment variables. Generally, when we write npm scripts, we set environment variables such as NODE_ENV=production or BABEL_ENV=development, but to set those variables in Windows, you use the SET command, which means you need to do SET NODE_ENV=production or SET BABEL_ENV=development. The problem with this is that if you are working with other people that use Linux or Mac, they will have problems with the SET command, and probably you will need to ignore this file and modify it only for your local environment. This can be tedious. The solution to this problem is to use a package called cross-env; you can install it by doing npm install cross-env, and this will work in Windows, Mac, and Linux:
"scripts": {
"start": "cross-env NODE_ENV=development webpack-dev-server --
mode development --open",
"start-production": "cross-env NODE_ENV=production webpack-dev-
server --mode production"
}
- Case-sensitive files or directories: In reality, this also happens on Linux, but sometimes it is very difficult to identify this problem, for example, if you create a component in the components/home/Home.jsx directory but in your code you're trying to import the component like this:
import Home from './components/Home/Home';
Normally, this won't cause any problems on Mac but can generate an error on Linux or Windows because we are trying to import a file with a different name (because it's case-sensitive) into the directory.
- Paths: Windows uses a backslash (\) to define a path, while in Mac or Linux they use a forward slash (/). This is problematic because sometimes we need to define a path (in Node.js mostly) and we need to do something like this:
// In Mac or Linux
app.use(
stylus.middleware({
src: __dirname + '/stylus',
dest: __dirname + '/public/css',
compile: (str, path) => {
return stylus(str)
.set('filename', path)
.set('compress', true);
}
})
);
// In Windows
app.use(
stylus.middleware({
src: __dirname + '\stylus',
dest: __dirname + '\public\css',
compile: (str, path) => {
return stylus(str)
.set('filename', path)
.set('compress', true);
}
})
);
// This can be fixed by using path
import path from 'path';
// path.join will generate a valid path for Windows or Linux and Mac
app.use(
stylus.middleware({
src: path.join(__dirname, 'stylus'),
dest: path.join(__dirname, 'public', 'css'),
compile: (str, path) => {
return stylus(str)
.set('filename', path)
.set('compress', config().html.css.compress);
}
})
);