Question

我正在使用WebStorm进行react.js应用开发。我用let dateFormatter = DateFormatter() dateFormatter.dateFormat = "yyyy-MM-dd hh:mm:ss ZZZ" dateFormatter.locale = Locale(identifier: "en_US") print(dateFormatter.date(from: "2017-03-10 22:53:30 +0000") ?? "No Value") // always return No Value创建了开始项目。 Ctrl + S 可以很好地刷新更改并重新编译，但在WebStorm保存是自动的，并不总是启动。

我尝试使用Babel设置File Watcher，但它在箭头功能方面存在一些问题。 ES2015应该允许它们。

之后我尝试了webpack，然后事情横向发展到我必须清除所有内容并克隆我的repo并再次设置依赖关系... 第一个问题是箭头函数，然后是CSS，然后是图像，然后......由于MIME不兼容而被阻止... ...

webpack.conf.js：

＆＃13;

create-react-app

＆＃13;

的package.json

＆＃13;

var config = {
	entry: './main.js',

	output: {
		path:'/',
		filename: 'public/index.js',
	},

	devServer: {
		inline: true,
		port: 8080
	},

	module: {
		loaders: [
			{
				test: /\.jsx?$/,
				exclude: /node_modules/,
				loader: 'babel-loader',

				query: {
					plugins: ['transform-runtime','transform-class-properties'],
					presets: ['es2015', 'react']
				}
			},{ test: /\.svg$/, loaders: ['babel?presets[]=react', 'svg-jsx'] }
		]
	}
}

module.exports = config;

＆＃13;

我不知道要包含哪些文件，因此请在评论中提问并添加它们。

我想要什么？我想在文件中更改内容时自动刷新/重新编译。就像 Ctrl + S 功能一样。我想在WebStorm中使用它。该文件观察器看起来更容易修复。

EDIT1：我尝试禁用var config = { entry: './main.js', output: { path:'/', filename: 'public/index.js', }, devServer: { inline: true, port: 8080 }, module: { loaders: [ { test: /\.jsx?$/, exclude: /node_modules/, loader: 'babel-loader', query: { plugins: ['transform-runtime','transform-class-properties'], presets: ['es2015', 'react'] } },{ test: /\.svg$/, loaders: ['babel?presets[]=react', 'svg-jsx'] } ] } } module.exports = config;（同样的webpack conf，错误列表如下）：

＆＃13;

safe write

＆＃13;

Answer 1

解决方案之一（Michael Jungo暗示）：禁用Webstorm选项中的safe-write＆gt;外观和行为＆gt;系统设置＆gt;解开＆＃34;安全写＆＃34;

解决方案二（对于babel filewatcher）：

运行npm install --save-dev babel-plugin-transform-class-properties
将--plugins transform-class-properties添加到文件观察程序参数。

两者都可以在反应应用网站上轻松刷新更改。第一个手动第二个自动。我是新手，也许不了解究竟发生了什么，但如果我不必总是重新启动服务器，那么它会让开发变得更容易。

反应自动重新编译WebStorm

1 个答案: