# react项目中的npm脚本
After you have learned about the folder and file structure of your React project, let’s go through the available commands(可用命令). All your project-specific commands can be found in your package.json file under(在....下面) the scripts property. They may(可能) look similar to these depending on your Vite version:
# package.json文件描述npm脚本
"dev": "vite",
"build": "vite build",
"lint": "eslint .",
"preview": "vite preview"
2
3
4
hese scripts are executed with the npm run <script> command in an IDE-integrated terminal or your standalone command line tool. The commands are as follows:
# Runs the application locally for the browser
npm run dev
# Lint the application locally for code style errors
npm run lint
# Builds the application for production
npm run build
2
3
4
5
6
Another(另一个) command from the previous npm scripts called preview can be used to run the production-ready build on your local machine for testing purposes. In order to make it work, you have to execute npm run build before running npm run preview. Essentially npm run dev and npm run preview (after npm run build) should give the identical output in the browser. However, the former is not optimized for production and should exclusively be used for the local development of the application.
# 练习(Exercises)
Exercise npm scripts: – Start your React application with npm run dev on the command line and check it out in the browser.
- Exit the command on the command line by pressing Control + C.
– Run the npm run build script and verify that a dist/ folder was added to your project. Note that the build folder can be used later on to deploy your application. Afterward, run npm run preview to see the production-ready application in the browser.
- Every time we change something in our source code throughout the coming sections, make sure to check the output in your browser for getting visual feedback. Use npm run dev to keep your application running.
- Optional: If you use git and GitHub, add and commit your changes after every section of the book.