我从事Nextjs 8.1版应用程序的开发已经一年了。当我运行npm run dev
命令时,应用程序以开发模式运行。当我更改一段代码并将其保存时,该应用将 重新加载 ,但更改未应用。
这是我的 package.json 文件内容:
{
"name": "Karan",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"dev": "SET NODE_ENV=development && SET PORT=4000 && node server.js",
"build": "next build",
"prod-build": "next build",
"next": "next start",
"start": "SET NODE_ENV=production && SET PORT=8080 && node server.js"
},
"keywords": [],
"author": "",
"license": "ISC",
"dependencies": {
"@ckeditor/ckeditor5-basic-styles": "^11.1.4",
"@ckeditor/ckeditor5-build-classic": "^12.4.0",
"@ckeditor/ckeditor5-font": "^11.2.2",
"@ckeditor/ckeditor5-paragraph": "^11.0.5",
"@ckeditor/ckeditor5-react": "^1.1.3",
"@fullpage/react-fullpage": "^0.1.17",
"@sentry/browser": "^4.6.6",
"@svgr/webpack": "^4.3.2",
"@zeit/next-css": "^1.0.1",
"@zeit/next-stylus": "^1.0.1",
"axios": "^0.18.1",
"cleave.js": "^1.5.10",
"express": "^4.17.1",
"global": "^4.4.0",
"jalaali-js": "^1.1.0",
"leaflet": "^1.5.1",
"moment-jalaali": "^0.8.3",
"moment-jalali": "^0.3.9",
"next": "^8.1.0",
"next-images": "^1.1.2",
"next-routes": "^1.4.2",
"npm": "^6.12.1",
"numeral": "^2.0.6",
"persianjs": "^0.4.0",
"pm2": "^3.5.1",
"prop-types": "^15.6.2",
"qs": "^6.8.0",
"react": "^16.9.0",
"react-bootstrap-star-rating": "^3.5.5-alpha.0.3",
"react-dom": "^16.9.0",
"react-leaflet": "^2.4.0",
"react-modal": "^3.9.1",
"react-modern-calendar-datepicker": "^3.1.6",
"react-paginate": "^5.2.4",
"react-persian-calendar": "^1.0.3",
"react-rating": "^2.0.4",
"react-redux": "^5.0.7",
"react-responsive": "^5.0.0",
"react-select": "^2.4.4",
"react-share": "^2.4.0",
"react-slick": "^0.23.1",
"react-star-ratings": "^2.3.0",
"react-toastify": "^4.3.0",
"redux": "^4.0.4",
"redux-devtools-extension": "^2.13.5",
"redux-logger": "^3.0.6",
"redux-thunk": "^2.3.0",
"stylus": "^0.54.5"
},
"devDependencies": {
"cross-env": "^5.2.1",
"optimize-css-assets-webpack-plugin": "^5.0.3",
"poststylus": "^1.0.0"
}
}
这是 next.config.js 文件:
const withCss = require('@zeit/next-css'); // used to load css files
const withStylus = require('@zeit/next-stylus'); // used to load stylus files
const withImages = require('next-images'); // used to load local images
const OptimizeCSSAssetsPlugin = require('optimize-css-assets-webpack-plugin'); // used to minimize the compiled css file in production mode
module.exports = {
...withStylus(
withCss(
withImages(
{
cssLoaderOptions: {
url: false
},
// production config to minimize the compiled css file
webpack(config) {
if (config.mode === 'production') {
if (Array.isArray(config.optimization.minimizer)) {
config.optimization.minimizer.push(new OptimizeCSSAssetsPlugin({}));
}
}
return config;
}
}
)
)
),
env: {
/*
* api route and website route in production and development mode
* you should use build dev routes in development mode and for nightly version
* and use the master build routes for production mode and master build for main server
*/
//dev build
apiRoute: 'https://nightly.karan.ir',
websiteRoute: 'https://nightly.karan.ir',
useTagManager: false,
// for master build
// apiRoute: "https://karan.ir",
// websiteRoute: "https://karan.ir",
// useTagManager: true,
// this value is used to determine which environment is active to active firebase cloud messaging or not
enableFireBase: 'false'
}
};
如果我在终端中按Ctrl + C
,然后再次运行npm run dev
,则所有更改都将应用。