Tag: webpack

Angular 4生产部署工作stream程: 我和一位同事讨论了如何将angular度4应用程序部署到生产服务器。如果可能的话，希望从社区那里得到实际的build议和指导。前提1 在生产服务器上， git pull npm install {set up production configuration} ng build –prod –aot 在生产服务器上构build和编译生产服务器硬件规格需要支持构build过程托pipe服务器上需要添加空间以容纳node_modules git repo master分支没有编译代码，因此是一个“clean source repo” 前提2 在生产服务器上， git pull 在本地开发工作站上build立和编译生产代码将会更快 git repo master分支将保留已编译代码的部署快照生产服务器仍然是一个有限的空间的128MB的RAM，因为它是服务的HTML，JS和CSS。当需要进行恢复或缩放时，可以更快部署到另一台服务器，因为它只是一个混帐

如何pipe理多个节点项目？: 我们正在使用3个不同的节点项目：项目1 ，项目2和项目3使用react和webpack 。所有3个项目都在3个不同的仓库中。项目1和项目2是独立的，但项目3需要项目1和项目2的压缩文件，并作为devDependencies（node_modules）放在项目3中。现在，我们需要在Project 1或Project 2中进行更改，以便在Project 3中使用新的zip文件。为了debugging，我们需要更改Project 1或Project 2中的代码，然后使用npm pack一个压缩文件，然后在Project 3中更新该压缩文件并停止Project 3的生成，然后再次卸载并安装该压缩文件，然后运行项目3再次。另一个更快一点，一个解决scheme是使用npm包构build项目1或项目2 ，然后复制生成的lib文件，然后将其复制到项目3运行实例中的/node_modules/Project 1(or2)/lib文件夹中。有没有更好或更快或更方便的方法来pipe理所有这些项目？请不要build议lerna 。莱纳是一个伟大的工具，但它需要改变的架构是不可行的。

Webpack / Express – 服务器找不到的环境variables: 在我的Express / React应用程序中，我使用Webpack来处理服务器端的渲染。但是，我正在遇到与我试图在我的Express服务器脚本中访问的环境variables有关的构build错误。在服务器脚本index.js ，我设置了一些variables，如下所示： const gitCommit = process.env.GIT_COMMIT || require("./gitignore/git_commit.js"), buildDate = process.env.BUILD_DATE || require("./gitignore/build_date.js") 而且由于我在本地机器上运行testing生产版本，我删除了gitignore/目录并设置了这些环境variables： $ export GIT_COMMIT="test commit hash" $ export BUILD_DATE="test build date" 然后我npm run build ，执行以下脚本： "build:client": "webpack –config webpack.config.js", "build:server": "webpack –config webpack.server.config.js", "build": "npm run build:client && npm run build:server" build:client执行没有问题，但build:server抛出错误… ERROR in ./index.js Module not found: […]

通过webpack为不同的环境加载url常量: 我有webpack.config.js文件： 'use strict'; var webpack = require('webpack') var env = process.env.NODE_ENV var API_URL_1 = { production: JSON.stringify('http://xyz:8000/api/v1/var'), development: JSON.stringify('http://192.168.99.102/api/v1/var') }; var API_URL_2 = { production: JSON.stringify('http://xyz:8000/api/v1/ui'), development: JSON.stringify('http://192.168.99.102/api/v1/ui"') }; var API_URL_3 = { production: JSON.stringify('http://xyz:8000/api/v1/data'), development: JSON.stringify('http://192.168.99.102/api/v1/data') }; var API_URL_4 = { production: JSON.stringify('http://xyz:8000/api/v1/calculated'), development: JSON.stringify('http://192.168.99.102/api/v1/calculated') }; var config = { module: { loaders: [ […]

如何通过npm发布基于反应的组件而不包括反应？: 我有一个简单的组件，需要反应和mobx使用。当我通过webpack构build我的图书馆时，它包括反应，mobx和mobx在这个包中作出反应。不过，我想添加他们作为一个对等的依赖，让我的模块的用户安装库。这可能吗？我的webpackconfiguration看起来像这样，它很好地构builddist / build.js我只需要解决如何排除库。 module.exports = { entry: [ './index.js' ], output: { path: path.resolve('./dist'), filename: 'build.js', library: 'myLibrary', libraryTarget: 'commonjs' }, module: { rules: loaders }, plugins: [ new webpack.NoEmitOnErrorsPlugin(), new webpack.optimize.UglifyJsPlugin({ sourceMap: true, compress: { warnings: false } }) ] }

WebPack：如何看bower.json和.bower.json: 我已经能够获得webpack在bower_components中查找组件。我遇到的问题是，一个bower组件只包含.bower.json而不是一个bower.json文件（注意第一个文件名前面有一个. ）。我的webpack.config.js文件的简化版本如下所示： var ResolverPlugin = require('webpack/lib/ResolverPlugin'); // webpack configuration module.exports = { entry: { app: 'app.js' }, output: { filename: '[name].js' }, resolve: { modulesDirectories: ['node_modules', 'web_modules', 'bower_components', 'static'] }, plugins: [ new ResolverPlugin( new ResolverPlugin.DirectoryDescriptionFilePlugin('bower.json', ['main']) ) ] }; 我试图使用jquery.selectBoxIt作为凉亭组件。另一个问题可能是它的.bower.json文件中缺less一个main字段。对于它的价值，我已经包括在下面的文件： // .bower.json { "name": "jquery.selectBoxIt", "homepage": "https://github.com/gfranko/jquery.selectBoxIt.js", "version": "3.8.1", "_release": […]

无法导入模块：您可能需要一个合适的加载程序: 我有一个使用bower和webpack的React项目。我正在尝试使用这个模块https://github.com/jrowny/react-absolute-grid 。我用npm安装它，然后把它添加到我的代码中，如下所示： import AbsoluteGrid from 'react-absolute-grid/lib/AbsoluteGrid.jsx'; 导入模块时，出现这个问题： Line 3: Unexpected token You may need an appropriate loader to handle this file type. | 'use strict'; | | import React from 'react'; 我怀疑问题是，在webpack.config.js我只加载文件从我的代码是： var webpack = require('webpack'); var path = require('path'); var BUILD_DIR = path.resolve(__dirname, 'src/client/public'); var APP_DIR = path.resolve(__dirname, 'src/client/app'); var config = […]

webpack当试图编译反应时退出状态4294967295: 我正在尝试创build我的第一个反应项目并尝试一个教程。我基于我的webpackconfigurationclosures该示例项目，但是当我运行webpack，我得到一个错误。这是npm-debug日志： 0 info it worked if it ends with ok 1 verbose cli [ 'C:\\Program Files\\nodejs\\node.exe', 1 verbose cli 'C:\\Users\\daford\\AppData\\Roaming\\npm\\node_modules\\npm\\bin\\npm-cli.js', 1 verbose cli 'run', 1 verbose cli 'production' ] 2 info using npm@3.8.6 3 info using node@v5.10.0 4 verbose run-script [ 'preproduction', 'production', 'postproduction' ] 5 info lifecycle nestlepronourish@1.0.0~preproduction: nestlepronourish@1.0.0 6 silly lifecycle […]

为什么试图在反应中导入括号'{'是一个意外的标记？: 我正在尝试使用Facebook的固定数据表模块，只需按照此页面上的基本示例： https ： //facebook.github.io/fixed-data-table/ 但是，当我尝试使用“npm run prod”（运行“npm webpack -p”）来使用webpack捆绑我的文件时，出现以下错误： SyntaxError: Unexpected token: punc ({) [./app/index.js:1,0] 这些只是index.js中的一行： import {Table, Column, Cell} from 'fixed-data-table'; 这就是我的package.json文件的样子： { "name": "datatables", "version": "1.0.0", "description": "", "main": "index.js", "scripts": { "prod": "webpack -p", "start": "webpack-dev-server" }, "author": "", "license": "ISC", "dependencies": { "fixed-data-table": "^0.6.3", "react": "^15.3.1", "react-dom": "^15.3.1" }, "devDependencies": { […]

Webpack：Bundle.js – 未捕获的ReferenceError：进程未定义: 这是我的webpack.config.js "use strict"; module.exports = { entry: ['./main.js'], output: { path: __dirname, filename: 'bundle.js' }, module: { loaders: [ { test: /.js?$/, loader: 'babel-loader', exclude: /node_modules/, query: { presets: ['es2015', 'react'] } }, {test: /\.json$/, loader: "json"}, ] }, externals: { React: 'react', }, target: "node", }; 和Main.js import React from 'react'; import ReactDOM from […]